JQuery меню при наведении - PullRequest
Новая
       15

JQuery меню при наведении

2 голосов
/ 18 апреля 2011

Я использую следующий код для управления всплывающим меню. 

var timeouts = {};
$(".item-wrapper").hover(function() {
var rel = $(this).attr("rel");
var el = $('#' + rel + '-tip');
if (timeouts[rel]) clearTimeout(timeouts[rel]);
timeouts[rel] = setTimeout(function () { el.fadeIn("fast").show(); }, 50);
},
function() {
var rel = $(this).attr("rel");
var el = $('#' + rel + '-tip');
if (timeouts[rel]) clearTimeout(timeouts[rel]);
timeouts[rel] = setTimeout(function () { el.hide() }, 500);
});

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

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

Я думал, что этого можно достичь, используя где-то $ (". Tip"). Hide (), но я не уверен, куда его поместить.

Любая помощь приветствуется.

1 Ответ

0 голосов
/ 18 апреля 2011

Добавить класс к активному совету. Прежде чем показывать следующий, получите размер активного класса и скройте его 

var timeouts = {};
$(".item-wrapper").hover(function() {
var rel = $(this).attr("rel");
var el = $('#' + rel + '-tip');
if(!el.hasClass('active') && $('.active').size() > 0)
    $('.active').removeClass('active').hide();
el.addClass('active');
if (timeouts[rel]) clearTimeout(timeouts[rel]);
timeouts[rel] = setTimeout(function () { el.fadeIn("fast").show(); }, 50);
},
function() {
var rel = $(this).attr("rel");
var el = $('#' + rel + '-tip');
if (timeouts[rel]) clearTimeout(timeouts[rel]);
timeouts[rel] = setTimeout(function () { el.hide() }, 500);
});
...