В этой статье описывается реализация коробки с приглашением на затягивании от JS+CSS. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
Скопируйте код следующим образом: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<голова>
<meta http-equiv = "content-type" content = "text /html; charset = utf-8" />
<Title> Box Pop-Up Pop-Up, созданная JS+CSS </title>
<стиль типа = "text/css">
{цвет:#000; размер шрифта: 12px; текстовое декорация: нет}
A: Hover {Color:#900; Текстовое декорация: подчеркивание}
Body {founal :; filter: progid: dximagetransform.microsoft.gradient (gradientType = 0, startColorStr =#ffffff, endColorStr =#003366); переполнение: скрыто}
#massage_box {position: Absolute; Слева: выражение ((body.clientWidth-350)/2); Верх: выражение ((body.clientHeight-200)/2); Ширина: 350px; Высота: 200px; Фильтр: Dropshadow (Color =#666666, OFFX = 3, OFFY = 3, положительный = 2); Z-Index: 2; видимость: скрыта}
#mask {position: Absolute; Верх: 0; слева: 0; Ширина: выражение (body.scrollwidth); высота: экспрессия (body.scrollheight); Фон:#666; Фильтр: альфа (непрозрачность = 60); z-index: 1; видимость: скрыта}
.massage {Border:#036 Solid; ширина границы: 1 1 3 1; Ширина: 95%; высота: 95%; Фон: #ffff; Цвет:#036; размер шрифта: 12px; Линия-высота: 150%}
.Header {founale:#036; высота: 10%; Семейство шрифта: Вердана, Ариал, Хельветика, Санс-Сэриф; размер шрифта: 12px; Заполнение: 3 5 0 5; Цвет: #fff}
</style>
<!-реализовать движение слоя->
<script language = "javascript">
var obj = ''
document.onmouseup = mup
document.onmouseMove = mmove
функция mdown (Object) {
Object.id
Document.all (obj) .setCapture ()
px = event.x-document.all (obj) .style.pixelleft;
py = event.y-document.all (obj) .style.pixeltop;
}
функция mmove () {
if (obj! = '') {
document.all (obj) .style.left = event.x-px;
document.all (obj) .style.top = event.y-py;
}
}
функция mup () {
if (obj! = '') {
Document.all (obj) .ReleaseCapture ();
Obj = '';
}
}
</script>
</head> <body>
<div id = "massage_box"> <div>
<div onmousedown = mdown (massage_box)>
<span onclick = "massage_box.style.visibility = 'hidden'; mask.style.visibility = 'hidden'" style = "float: справа; дисплей: inline; cursor: hand"> × </span> </div>
</div> </div>
<div id = "mask"> </div>
<span onclick = "mask.style.visibility = 'visible'; massage_box.style.visibility = 'visible'" style = "cursor: hand"> <a href = "#"> <font size = 18px> Щелкните эту подсказку </font> </a> </span>
</body>
</html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.