Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.08.2012, 17:57
Аватар для CyMKuH
Интересующийся
Отправить личное сообщение для CyMKuH Посмотреть профиль Найти все сообщения от CyMKuH
 
Регистрация: 11.07.2011
Сообщений: 26

Выпадающее меню
Есть меню навигации, каждый пункт - div, один из пунктов - должен быть выпадающим, когда наводишь на него под ним появляется div id=sub_navigation

Обработчики hover:

$(document).ready(function() {
  $("div.menu_items").hover (
    function () {
        if (id=='menu_3') {   
          $("div#sub_navigation").fadeIn(200);
        }
        $(this).find("div.m_background").fadeIn(200);

    }, 
    function () {
        if (id=='menu_3') {
          $("div#sub_navigation").fadeOut(200);
        }
        $(this).find("div.m_background").fadeOut(200);
      }
    } 
  );       

  $("div#sub_navigation").hover (
    function () {
      $(this).fadeIn(200);
      $("div#menu_3").find("div.m_background").fadeIn(200);
    },
    function () {
      $(this).fadeOut(200);
      $("div#menu_3").find("div.m_background").fadeOut(200);
    } 
  ); 
});


Проблема в том, что выпадающее меню и задний фон пункта основного меню появляются через fadeIn и когда я веду курсор от пункта основного меню к выпадающему, они сначала "затухают", а потом "появляются"... Если делать без fadeIn fadeOut - просто display: block, display: none - работает всё нормально... но нужно с анимацией... Подскажите пожалуйста решение.
Ответить с цитированием
  #2 (permalink)  
Старый 09.08.2012, 19:57
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

CyMKuH,
Добавьте минимальный HTML код
Ответить с цитированием
  #3 (permalink)  
Старый 09.08.2012, 20:26
Аватар для CyMKuH
Интересующийся
Отправить личное сообщение для CyMKuH Посмотреть профиль Найти все сообщения от CyMKuH
 
Регистрация: 11.07.2011
Сообщений: 26

<div id="navigation">
<div act="on" class="menu_items borders" id="menu_1"></div>
<div act="off" class="menu_items borders" id="menu_3"></div>
<div act="off" class="menu_items borders" id="menu_4"></div>
<div act="off" class="menu_items borders" id="menu_5"></div>
<div act="off" class="menu_items borders" id="menu_6"></div>
<div act="off" class="menu_items " id="menu_7"></div>
</div>
<div id="sub_navigation" style="display: none"></div>

В каждом диве класса menu_items есть див div.m_background - это типа фон. Каждый div.menu_items имеет размеры. По высоте - все одинаковы (меню горизонтальное) Под div#menu_3 позицианируется абсолютно div#sub_navigation. Стоят "встык". т.е. когда я двигаюсь вниз с menu_3 то сразу попадаю на div#sub_navigation. div#sub_navigation шире чем div#menu_3
Ответить с цитированием
  #4 (permalink)  
Старый 09.08.2012, 20:49
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

CyMKuH,
Это - не пойдёт ? Проблема с автоскрытием элементов навигации пост 21
Ответить с цитированием
  #5 (permalink)  
Старый 09.08.2012, 21:03
Аватар для CyMKuH
Интересующийся
Отправить личное сообщение для CyMKuH Посмотреть профиль Найти все сообщения от CyMKuH
 
Регистрация: 11.07.2011
Сообщений: 26

Сообщение от Deff Посмотреть сообщение
CyMKuH,
Это - не пойдёт ? Проблема с автоскрытием элементов навигации пост 21
Не то...(((
Ответить с цитированием
Ответ


Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Находится ли мышка над дивом ? (выпадающее меню) advsm jQuery 31 24.09.2014 17:50
Выпадающее меню для внутренней навигации по закладкам на странице на javascript+css rdfhnbhf jQuery 1 13.07.2012 15:17
Выпадающее меню для внутренней навигации по закладкам на странице на javascript+css rdfhnbhf Javascript под браузер 1 13.07.2012 12:26
Проблема с аккордионом и меню Tie ExtJS 3 01.09.2011 14:36
Выпадающее меню не работает в Chrome Bangoo jQuery 1 21.03.2011 20:33