jQuery: меню наведения — очистка кода — оставить меню открытым

Я искал SO, и этот вопрос, кажется, задавали несколько раз, но я не могу заставить его работать в моем примере.

Вот код для экспериментов: http://jsfiddle.net/vol7ron/w8QsZ/2/

Я ищу что-то похожее на подсказку Flowplayer, где:

  • есть триггер, вызывающий появление меню при наведении
  • меню исчезает при выходе из триггера
  • если пользователь наводит курсор на меню (или всплывающую подсказку), всплывающее окно должно оставаться открытым

Я предполагаю, что триггер hoverOut должен вызвать исчезновение с помощью setTimeout() с некоторой задержкой, но в меню mouseenter() тайм-аут должен быть очищен.

Я все еще новичок в jQuery и не знаю, где хранить сгенерированный timeoutID и где его вызывать.

Примечание. одно и то же меню будет использоваться для нескольких триггеров.


Обновление: Хорошо, у меня есть кое-что работающее: здесь
Может ли кто-нибудь помочь мне очистить его и сделать его более эффективным. Что еще более важно, я бы не хотел использовать глобальные переменные для timeoutID. Возможно, есть лучший способ сохранить его в объекте?


person vol7ron    schedule 16.11.2010    source источник
comment
Google jQuery hoverIntent для ваших проблем с тайм-аутом hoverOut.   -  person superUntitled    schedule 17.11.2010
comment
Я видел hoverIntent, я собирался указать, что я бы предпочел не использовать его здесь, но мой вопрос раздувался текстом :) Спасибо за ввод - в моем приложении много js, а производительность (загрузка страницы) - начинает страдать.   -  person vol7ron    schedule 17.11.2010


Ответы (1)


Я недавно сделал что-то подобное. Что бы я сделал, это

var timer = setTimeout(/*blah*/);
$('#my_selector').data('timer') = timer;

Я добавляю timeoutID в данные для этого элемента, а затем, когда мне нужно что-то сделать с ним позже (clearTimeout), я могу просто взять его оттуда.

примечание. Я использовал этот метод, и он работал для динамического количества элементов, что, как я думаю, вам нужно. Просто дайте мне знать, если вам нужно больше объяснений!

person Aaron Hathaway    schedule 16.11.2010
comment
Я на самом деле понял, что я сделал неправильно, пожалуйста, посмотрите и посмотрите, как это исправить. - person vol7ron; 17.11.2010
comment
Я использую глобальные переменные, которые мне не очень нравятся. Я не знаком с методом .data(), поэтому, возможно, я могу изучить его. Моя цель — создать редактор на месте, похожий на Wiki. - person vol7ron; 17.11.2010
comment
Я принял этот ответ, главным образом потому, что он был единственным :) Но также и потому, что он познакомил меня с data(). - person vol7ron; 29.11.2010