4 ссылки, при наведении на которые - разное меню
Состоит из нескольких частей, которые нужно вставлять в разные места:
В HTML-верх:
<style type="text/css"> #part1,#part2,#part3,#part4 { z-index: 2; position: absolute; visibility: hidden} </style>
В HTML-низ:
<script language="JavaScript"> function part1ON() {document.getElementById("part1").style.visibility='visible'} function part2ON(){document.getElementById("part2").style.visibility='visible'} function part3ON(){document.getElementById("part3").style.visibility='visible'} function part4ON(){document.getElementById("part4").style.visibility='visible'} function part1OFF() {document.getElementById("part1").style.visibility='hidden'} function part2OFF(){document.getElementById("part2").style.visibility='hidden'} function part3OFF(){document.getElementById("part3").style.visibility='hidden'} function part4OFF(){document.getElementById("part4").style.visibility='hidden'} </script>
В обьявление
<a href="" onMouseOver="part1ON()" onMouseOut="part1OFF()">Линка 1</a> <a href="" onMouseOver="part2ON()" onMouseOut="part2OFF()">Линка 2</a> <a href="" onMouseOver="part3ON()" onMouseOut="part3OFF()">Линка3</a> <a href="" onMouseOver="part4ON()" onMouseOut="part4OFF()">Линка 4</a> <div id="part1" class="container"> Контейнер номер 1 </div> <div id=part2 class="container"> Контейнер номер 2 </div> <div id=part3 class="container"> Контейнер номер 3 </div> <div id="part4" class="container"> Контейнер номер 4 </div>
Кроме части для обьявления ничего менять ненадо!!
Содержимое появляющегося меню находиться между тегами <div ...></div> - тоесть то что ты хочешь что б у тебя было в меню- ставить туда. Можно вставлять туда всё, что угодно; картинки, ссылки, кнопки, таблицы и тд, хоть еще одно всплывающее меню! Вот и всё)