jQuery菜單懸停

Question

我正在使用下面的代碼來控制彈出式菜單。

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（）某處，但我不知道該把它放在哪裏。

任何幫助表示讚賞。

Answer 1

添加班級到活動提示。顯示未來之前，讓活動類的大小，並把它隱藏

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); 
});