Нажмите на эффект слоя POP -UP & amp;

Автор：Eve Cole Время обновления：2025-03-01 03:32:01

Код кода копирования следующим образом:

<html>

<голова>

<Title> Специальные эффекты Web Special Effects-Window-эффект веб-фона после всплывающего окна становится темнее </title>

<!-Добавьте следующий код между <Head> и </head>->

<Стиль типа = "text/css">

.BLACK_OVERLAY Непрозрачность: .80;

.WHITE_CONTENT { Переполнение: auto;}

</style>

</head>

<тело>

<!-Добавьте следующий код между <body> и </body>->

Нажмите здесь, чтобы открыть окно </a>

Закрыть </a>

<br> Содержание окон

</div>

</body>

</html>

Пример 2:

Код кода копирования следующим образом:

<TILE> НЕ -ТИТЛА СТРАНИЦА </TITE>

Функция Hid ()

{{

var div4 = document.getElementbyId ("div1");

div4.style.display = "block";

div4.style.width = "200px";

div4.style.head = "150px";

div4.style.zindex = "9999";

div4.style.top = "43%";

div4.style.left = "43%";

div4.style.position = "Absolute";

var div3 = document.getElementbyId ("div2");

div3.style.display = "block";

div3.style.width = "1000px";

div3.style.zindex = "9998";

div3.style.position = "Absolute";

div3.style.head = document.body.offsetheight;

div3.style.top = "0px";

div3.style.left = "0px";

}

Function vis ()

{{

var div4 = document.getElementbyId ("div1");

div4.style.display = "нет";

var div3 = document.getElementbyId ("div2");

div3.style.display = "нет";

div3.style.width = "0px";

div3.style.head = "0px";

div4.innerhtml = "<a onclick = 'vis ()' style = 'display: block' id = 'text'> нажмите, чтобы закрыть </a> <br /> <input name = 'textbox2' type = 'text' id = 'textbox2' /> <br /> <input id = 'button3' type = 'futtion' value = 'onclick =' return Button3_onclick () ";

}

</script>

</head>

<тело>

<Таблица cellpadding = "0" cellspacing = "0">

<!-dwlayouttable->

<tr>

<a onclick = "hid ()"> нажмите, чтобы отобразить </a> <br />

<div style = "color: белый;

<a onclick = "vis ()" style = "display: block" id = "text"> Нажмите, чтобы закрыть </a> <br />

<br />

<ASP: TextBox id = "TextBox2" Runat = "Server"> < /asp: textbox> <br />

</div>

</form> </td>

</tr>

</table>

</div>

</body>

</html>

Пример 3:

Код кода копирования следующим образом:

<голова>

<TILE> Нажмите на эффект слоя POP -UP </title>

<style>

* {margin: 0;}

Body {font-size: 12px;}

#Container div {margin-top: 5px;}

#Select_city h3 {float: left;}

#main_city,#all_province {clear: оба;}

#Main_city div,#all_province div {width: 600px;

#Main_city H4,#all_province h4 {float: left;

#Main_city div span,#all_provring div

#Float_lay {ширина: 200px;

</style>

// поп -слой

Функция OpenLayer (objid, conid) {

var ArrayPagesize = getPagesize ();

var arraypagescroll = getPagescroll ();

if (! document.getElementById ("PopuPAddr") {) {

// Создать слой контента POP -UP

var pospdiv = document.createElement ("div");

// Установить атрибуты и стили в этот элемент

Popupdiv.setattribute ("id", "popupaddr")

popupdiv.style.position = "Absolute";

popupdiv.style.border = "1px solid #ccc";

popupdiv.style.background = "#fff";

popupdiv.style.zindex = 99;

// Создать фоновый слой POP

var bodyback = document.createElement ("div");

Bodyback.settattribute ("id", "bodybg")

bodyback.style.position = "Absolute";

bodyback.style.width = "100%";

Bodyback.style.head = (ArrayPagesize [1] + 35 + 'px');

bodyback.style.zindex = 98;

bodyback.style.top = 0;

bodyback.style.left = 0;

bodyback.style.filter = "alpha (непрозрачность = 50)";

bodyback.style.opacity = 0,5;

bodyback.style.background = "#ddf";

// реализовать POP -UP (после вставки целевого элемента)

var mybode = document.getElementByid (objid);

INSERTAFT (POPUPDIV, MYBODY);

Insertafter (bodyback, mybode);

}

// отображать фоновый слой

Document.GetElementById ("BodyBG").

// отображать слой содержимого

var postobj = document.getElementById ("PopuPaddr")

pos.innerhtml = document.getelementbyid (conf) .innerhtml;

pos.style.display = "";

// пусть слой -слой поп -топ вертикально и справа на странице (Unified)

// popobj.style.width = "600px";

// Popobj.

// popobj.

// пусть слой -слой поп -топ вертикально и справа на странице (личность)

var arrayconsize = getConsize (conf)

pos.style.top = arraypagescroll [1] + (ArrayPagesize [3] -ArrayConsize [1]) / 2-50 + 'px';

pos.style.left = (ArrayPagesize [0] -ArrayConsize [0]) / 2 -30 + 'px';

}

// Получить исходный размер уровня контента

Функция getConsize (conf) {

var conobj = document.getElementbyid (conf)

conobj.style.position = "Absolute";

conobj.style.left = -1000+ "px";

conobj.style.display = "";

Var arrayconsize = [conobj.offsetwidth, connableable

conobj.

Вернуть ArrayConsize;

}

Функция inserTafter (Newsmente, TargetElement) {// Вставка

var parent = targetElement.parentNode;

If (parent.lastchild == targetElement) {

Parent.appendchild (газета);

}

еще {

Parent.insertbefore (Newsmente, TargetElement.NextIbling);

}

// Получить высоту прокатного бара

функция getPagesCroll () {

Var yscroll;

if (self.pageyoffset) {

yscroll = self.pageyoffset;

} Else if (document.documentedelement && document.documentlement.scroltop) {{{{{{{{{{{{{{

yscroll = document.documendlement.scrolltop;

} else if (document.body) {{{{

yscroll = document.body.scrolltop;

}

arraypagescroll = new Array ('', yscroll)

Return Arraypagescroll;

}

// Получить фактический размер страницы

function getPagesize () {

var xscroll, yscroll;

if (window.innerheight && window.scrollmaxy) {{{{

xscroll = document.body.scrollwidth;

yscroll = window.innerheight + window.scrollmaxy;

} Else if (Document.body.scrollheight> document.body.offsetheight) {

sscroll = document.body.scrollwidth;

yscroll = document.body.scrollheight;

} Еще {

xscroll = document.body.offsetwidth;

yscroll = document.body.offsetheight;

}

var Windowwidth, WindowHeight;

// var pageHeight, pagewidth;

if (self.innerheight) {

Windowwidth = self.innerWidth;

Windowheight = self.innerheight;

} Else if (document.documentedelement && document.documentlement.clientheight) {

windowwidth = document.documentelement.clientwidth;

Windowheight = document.documentelement.clitingHeight;

} else if (document.body) {{{{

windowwidth = document.body.clientwidth;

WindowHeight = Document.Body.ClitingHeight;

}

Var Pagewidth, PageHeight

if (yscroll <windowheight) {

payheight = windowheight;

} Еще {

payheight = yscroll;

}

if (xscroll <windowwidth) {

PageWidth = Windowwidth;

} Еще {

pagewidth = xscroll;

}

ArrayPagesize = New Array (PageWidth, PageHeight, Windowwidth, WindowHeight)

Return ArrayPagesize;

}

// Закройте слой поп -музыки

Function closelayer () {

Document.GetElementById ("PopuPAddr").

Document.GetElementById ("BodyBG").

Вернуть ложь;

}

</script>

</head>

<тело>

<!-Первый содержимое слоя всплывающего окна->

<div id = "tabtop-l"> <strong> Настройки стиля </strong> </div>

<div id = "tabtop-r" onclick = "closelayer ()"> <strong> close </strong> </div>

</div>

<div id = "tabcontent"> отображать контент здесь </div>

</div>

<br>

<!-Второй контент всплывающего уровня->

<div id = "tabtop-l2"> <strong style = "color: block"> set rapts </strong> </div>

<div id = "tabtop-r2" onclick = "closelayer ()"> <strong style = "color: red"> close </strong> </div>

</div>

<p> Покажите быстрый контент здесь "

<p> Советы 1

<p> напоминание 2

</div>

<br>

1 <br>

<br>

<!-Третий содержимое слоя всплывающего окна->

<div id = "tabtop-l3"> <strong style = "color: red; font-size: 20px"> демонстрация стиля </strong> </div>

<div id = "tabtop-r3" onclick = "closelayer ()"> <strong> close </strong> </div>

</div>

<div id = "tabcontent3"> Содержание дисплея здесь </div>

</div>

</body>

</html>