Раскрывающееся меню DIV (2)
Автор:Eve Cole
Время обновления:2009-06-20 17:00:56
Вы можете разместить эту программу между тегами <head></head> или в любом месте веб-страницы.
Далее нам нужно определить наши фактические пункты меню. Здесь нам нужно добавить дескриптор события движения мыши (OnMouseOver) к каждому элементу меню и позволить этому событию вызывать функцию Show, которую мы определили выше. Другими словами, как только мышь входит в наш пункт меню, наша функция show начинает выполняться. Здесь нам также необходимо определить идентификационный номер для каждого из наших пунктов меню и передать идентификатор его столбца раскрывающегося меню в функцию «Показать». Это очень важно для нас для управления столбцом раскрывающегося меню «Под I». укажите идентификатор идентификатора пункта меню. Описание синтаксиса HTML:
<граница таблицы=0>
<тр>
<td ID="d1" onmouseover="show(this,ds1);" class="menu">Сайт журнала о технологиях</td>
<td ID="d2" onmouseover="show(this,ds2);" class="menu">Портал</td>
<td ID="d3" onmouseover="show(this,ds3);" class="menu">Личный любимый сайт</td>
</tr>
</таблица>
Наконец, нам нужно определить столбец раскрывающегося меню. Для каждого столбца раскрывающегося меню нам нужно присвоить ему атрибут CSS Submenu и имя идентификатора, чтобы наша функция Show могла управлять им. Наконец, мы устанавливаем для режима отображения по умолчанию значение none, что означает, что его не будет. отображается. Это достигается путем присвоения «none» стилю отображения. Ниже я дал описание синтаксиса HTML для столбца раскрывающегося меню:
<DIV ID="ds1" CLASS="подменю" STYLE="display:none">
<BR><A HREF="http:\www.yesky.com">tianji.com Yesky.com</A>
<BR><A HREF="http:\www.cbinews.com">Информация о компьютерном бизнесе</A>
<BR><A HREF="http:\www.newsoft.com.cn">Новая модная электроника</A>
<BR>
</DIV>
<DIV ID="ds2" CLASS="подменю" STYLE="display:none">
<BR><A HREF="http:\www.sina.com.cn">Сина Сина</A>
<BR><A HREF="http:\www.sohu.com.cn">SohuSohu</A>
<BR><A HREF="http:\www.163.com">Netease</A>
<BR>
</DIV>
<DIV ID="ds3" CLASS="подменю" STYLE="display:none">
<BR><A HREF="http:\haoel.yeah.net">Станция программирования сети мыши</A>
<BR><A HREF="http:\www.5460.net">Китайские одноклассники</A>
<BR><A HREF="http:\www.csdn.net">Китайская сеть разработчиков программного обеспечения</A>
<BR>
</DIV>
Вот и весь процесс. Выполнив описанные выше четыре шага, вы обязательно сможете увидеть меню на своей веб-странице, и оно обязательно будет выглядеть красиво. Конечно, вы также можете попробовать изменить свойства меню самостоятельно, чтобы оно больше походило на меню.