Форум Сайтостроение Веб-строительство

Вопрос по jQuery

[Удален]
1173

Есть код:

<ul id="topmenu">
<li><a href="/index.php">Главная</a>
<ul class="submenu">
<li><a href="/index.php">Главная</a>
</li>
<li><a href="#">Реклама</a></li>
<li><a href="#">О сайте</a></li>
<li><a href="#">Карта сайта</a></li>
<li><a href="#">Контакт</a></li>
</ul>
</li>
<li><a href="#">Реклама</a>
<ul class="submenu">
<li><a href="/index.php">Главная</a>
</li>
<li><a href="#">Реклама</a></li>
<li><a href="#">О сайте</a></li>
<li><a href="#">Карта сайта</a></li>
<li><a href="#">Контакт</a></li>
</ul>
</li>
<li><a href="#">О сайте</a></li>
<li><a href="#">Карта сайта</a></li>
<li><a href="#">Контакт</a></li>
</ul>

Выглядит это вот так:

Сделать нужно все как обычно - наводишь на пункт появляется подменю, уводишь курсор - исчезает.

Как себе это представляю - наводишь на ссылку, скрипт ищет ниже элемент с классом submenu и разворачивает его (slideDown) когда курсор уходит с submenu - slideUP.

Интересует именно развернутый ответ с объяснением! Буду очень признателен! ...читать всякие мануалы нет времени.

sirota77
На сайте с 08.09.2008
Offline
161
sirota77
#1
webor1on:
Интересует именно развернутый ответ с объяснение! Буду очень признателен!

А ну ка, сделайте и расскажите что и зачем! :)

AG
На сайте с 24.04.2007
Offline
115
AlexGM
#2

Вот пример того, что вам нужно с разъяснениями. Почитайте, все пошагово расписано.

Можете просто пройтись и выбрать что-то другое здесь

[Удален]
#3

AlexGM

Не плохо, только на ангиццком все :(

DU
На сайте с 02.10.2008
Offline
41
DIMAZRU
#4

Лучше по id отслеживать

$(document).ready(function() {

$("#submenu1").hide();

$("#submenu2").hide();

$("#m1,#submenu1").mouseenter(function() {$("#submenu1").fadeIn('fast');})

$("#m1,#submenu1").mouseleave(function() {$("#submenu1").delay(500).fadeOut('fast');})

$("#m2,#submenu2").mouseenter(function() {$("#submenu2").fadeIn('fast');})

$("#m2,#submenu2").mouseleave(function() {$("#submenu2").delay(500).fadeOut('fast'); })

});

$("#submenu1").hide(); скрыть элемент с id=#submenu1

$("#m1,#submenu1").mouseenter(function()/* при наведении мышки на элементы с id=m1 и id=submenu1 */ {$("#submenu1")./* элемент с id=submenu1 */fadeIn('fast');}) /* развернуть быстро

.delay(500). /* подождать 0,5 сек */ fadeOut('fast');}) /* свернуть быстро */

целиком 

<script src="http://www.google.com/jsapi"></script>  

<script type="text/javascript">  

  

    // Загружаем jQuery  

    google.load("jquery", "1.4");  

  

    google.setOnLoadCallback(function() {  

 $("#submenu1").hide();

 $("#submenu2").hide();

 

$("#m1,#submenu1").mouseenter(function() {$("#submenu1").fadeIn('fast');})

$("#m1,#submenu1").mouseleave(function() {$("#submenu1").delay(500).fadeOut('fast');})

$("#m2,#submenu2").mouseenter(function() {$("#submenu2").fadeIn('fast');})

$("#m2,#submenu2").mouseleave(function() {$("#submenu2").delay(500).fadeOut('fast'); })  

    });  

        

</script>



<script type="text/javascript">



</script>



<ul id="topmenu" >

<li>

<a href="/index.php" id="m1">Главная</a>

<ul id="submenu1">

<li><a href="/index.php">Главная</a>

</li>

<li><a href="#">Реклама</a></li>

<li><a href="#">О сайте</a></li>

<li><a href="#">Карта сайта</a></li>

<li><a href="#">Контакт</a></li>

</ul>

</li >

<li><a href="#" id="m2">Реклама</a>

<ul id="submenu2">

<li><a href="/index.php">Главная</a>

</li>

<li><a href="#">Реклама</a></li>

<li><a href="#">О сайте</a></li>

<li><a href="#">Карта сайта</a></li>

<li><a href="#">Контакт</a></li>

</ul>

</li>

<li><a href="#">О сайте</a></li>

<li><a href="#">Карта сайта</a></li>

<li ><a href="#">Контакт</a></li>

</ul>
Российский регистратор Reggi.ru .com .biz .org по 12$ + Бесплатный whois protect (http://www.reggi.ru?pid=6040)
Подгрузка html кода формы Выпадающее меню по клику иваки тожэ тупые а
[Удален]
#5
webor1on:
AlexGM

Не плохо, только на ангиццком все :(

Знание английского для разработчика необходимо как воздух. Учите, если конечно хотите стать хорошим разработчиком :)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий