{В предыдущем HTML позиции элементов можно было расположить только последовательно, и нам было сложно точно находить и контролировать некоторые элементы на веб-странице. CSS2? Каскадная таблица стилей уровня 2, атрибут Layout? Каскадной таблицы стилей версии 2 появляется и получает. Благодаря широкой поддержке браузеров мы можем не только достичь вышеуказанной цели статически, но и прогнозировать на основе мыши, клавиатуры, времени и т. д. Определенные внешние события динамически изменяют макет. «Активный слой» на очень популярных веб-страницах представляет собой его графическое приложение. Здесь мы поговорим о том, как использовать эти атрибуты в сочетании с некоторыми объектами DHTML для реализации раскрывающегося меню, аналогичного окну Windows в. веб-страницу (как показано на рисунке)). Пожалуйста, ознакомьтесь со следующим кодом и подробными инструкциями.
<?--Следующая часть должна быть вставлена после <head> кода-->
<style><?--
/? Это некоторые стили CSS. Среди них «btnTD» — это класс стиля, который «поднимает» кнопку перед ее нажатием: граница устанавливается в виде сплошной линии шириной 1 пиксель, где левая и верхняя границы имеют светлый цвет (здесь белый). , а нижняя правая граница представляет собой сплошную линию шириной 1 пиксель. Граница темная (темно-серая). Если этот стиль используется в HTML-элементе (например, ячейке) с серым фоном, он будет выглядеть очень красиво. очень похоже на «выступающую» кнопку; «btnDTD» означает, что кнопка «вогнутая» при нажатии. ?／
．
BTNTD
-Левый? 1 Сплошной #FFFFFF
?
BTNDTD -слева 1 сплошной # 808080? 1 сплошной #FFFFFF?
1
сплошной # 808080
??ШРИФТ -FMILY? Fon -siｚe ?
> ＞
＜?--
//Глобальная переменная, определяющая, какая кнопка нажата
var intBlnClk=0?
//Мышь перемещается, уходит и щелкает для изменения стиля ячейки.
Функция mOvrOut?objSrc??
var argv?argc?blnActive? strColor?strBgColor?strClass?strClassD? strCursor?
argv=mOvrOut. Аргументы?argc=argv. length?
/?Не устанавливать текущий объект как «активный» по умолчанию?/
blnActive=?argc>1?﹖ eva?argv[1]??false?
/?Стиль текущего объекта по умолчанию при перемещении мыши — «выступающая форма кнопки»?/
strClass=?argc>2 && arg v［2］?＝''?﹖ argv[2]?'btnTD'?
/?Текущий объект по умолчанию имеет форму «вогнутой кнопки» при нажатии мыши?/
strClassD=?argc>3 && argv［3 ]?=''?﹖ argv[3]?′ｂｔＤＴＤ'?
/? Установить цвет переднего плана текущего объекта на белый, цвет фона на синий и стиль мыши на форму руки? /
ｓｔＣｏｏ＝'#ffffff'?str BgColor='#000080 ’?strCursor= 'hand'?
/? IE4 и более поздние версии поддерживают только эти динамические изменения стилей CSS? /
if? all??
//Устанавливаем стиль мыши текущего объекта в соответствии со значением, переданным параметром
objSrc. стиль. курсор=strCursor?
//Если мышь входит в диапазон текущего объекта
if??objSrc. содержание? событие. fromElement???
/? Установить как активный стиль? /
if?blnActive?? bgColor=strBgColor?objSrc. стиль. color=strColor? ?
/?Когда текущий объект не нужно устанавливать в качестве активного стиля, если исходный стиль представляет собой «выступающую форму кнопки», установите для него «вогнутую форму кнопки» и наоборот?/
else objSrc. className=?intBlnClk?=0?﹖ ｓｒＣａｓＤ?ｔｔＣａａｓ?
//Мышь покидает текущую область объекта
else if??objSrc. содержание? событие. toElement???
// Установите для этих стилей значение по умолчанию
objSrc. bgColor=''?objSrc. стиль. цвет = ''?objSrc. ｃｌａｓＮｍｍｅｅｅｅｅｅ
/
? Общая функция отображения/скрытия слоев. Используйте objNS, objIE, strStu в качестве параметров, где objNS и objIE — это «слои» Netscape и IE соответственно. «Object, strStu — это состояние слоя. Из-за нехватки места, пожалуйста, ознакомьтесь с инструкциями в конце этой статьи. ?/
function showHidLayers????
/? Вызовите вышеуказанную функцию, чтобы показать/скрыть слой, переданный параметром, что упрощает код. Подробные функции здесь не приводятся. ?/
function showLayer?intCurrent???
//--></script> ＜/head＞
Element．style．color＝＝''? showLayer?1?'hide' ?″>
<?-- Функция выше часть тела предназначена для скрытия всех «меню», которые должны быть скрыты, когда мышь не нажимает какую-либо кнопку. Ниже приведены два слоя, определенные с помощью макета CSS. Исходное состояние слоя с именем «меню»: абсолютное положение на экране (12–12), видимое, атрибут z-index слоя равен 100; быть невидимым. -->
<div id="menu" style="position?absolute?visi bility?visible?left?12px?top?12px?z-index? 100″><tab ｌｌｏｄｅｅｅｅｅｅｅｅ Ｇ 2 ″ BGCOLOR = ″ # C0C0C0 ″ ДЕРКОЛОР = ″ # C0C0C0 ″ ＞ ＞ ＞ ＞ ｎ ｎ ｎ ″ ″ ″ ″ ″ ″ ″ ″ ″ ″ ″ ″ UT
Это ? ″> Tianji.com </ TD> </ TR ＞ < / Table ＞ </ DIV>
<DIV ID =″
″ ″ позиция? ? Скрыто? Слева? 11 пикселей? 34PX ? ｃ ｃ″? ???????????????????????????
TR ＞ <TD ONMOUSEOVER = ″ Movrout? TRUE ?″ onMouseOut=″mOvrOut?this?″ ширина =″100%″nowrap onC lick="ｗindow.location='http?／／ｗｗ.pcwclub.com／'? ｓｗｗＬａｅｒ1?'ｉｉｅｅｅ″＞Клуб читателей компьютерных новостей＜/td＞＜/tr＞
＜/таблица＞＜ /div＞
Из-за ограничений места некоторые функции не могут быть подробно описаны и объяснены. Если вам нужен полный код, перейдите по следующей ссылке: http?//ctsighｈ t. круто. сеть/документы/меню. html.