hoverIntent在選定元素上觸發'out'功能

下面的代碼用於顯示和隱藏Mega下拉菜單。如果將鼠標懸停在「dropDown」類的鏈接上，則它是「.dropPanel」節點的子節點。只要鼠標懸停在鏈接或放置面板上，放置面板仍會顯示。將光標移動到除鏈接或面板之外的任何位置，並且面板隱藏。很基本的東西。hoverIntent在選定元素上觸發'out'功能

在這些Mega Dropdowns中的一些中，有些表單包含select元素。在Firefox中，一切都很好。在IE中（具體來說，沒有測試過任何其他版本），如果你將鼠標放在放置面板中的select元素上，hoverIntent會觸發dropPanelOff（）的'out'函數並隱藏放置面板。

我該如何預防？

 // Apply Hover Intent to Menu Panels 
     $(".dropDown").hoverIntent({ 
      sensitivity: 10, 
      interval: 150, 
      over: dropPanelOn, 
      timeout: 150, 
      out: dropPanelOff 
     }); 

      // Menu Over function call 
      function dropPanelOn() { 
       $('a[rel="dropLink"]', this).addClass('hover'); 
       $('.dropPanel', this).slideDown('fast'); 
      } 

      // Menu Out function call 
      function dropPanelOff() { 
       obj = this; 
       $('.dropPanel', this).slideUp(100, function(){ 
        $('a[rel="dropLink"]', obj).removeClass('hover'); 
        $('.dropLink span', obj).removeClass('hover'); 
       }); 
      }

來源

2010-01-20 S16

你有沒有解決這個？我有同樣的問題與Firefox和登錄表單，Firefox顯示存儲的用戶名稱列表，你點擊這些鼠標事件觸發後觸發 – hugri 2010-10-06 12:42:56

仍然沒有，沒有。 – S16 2010-11-19 17:41:25

嘗試增加給你的代碼：

$(".dropDown select").mouseout(function(e) { 
     e.stopPropagation(); 
});

來源

2011-02-15 02:21:40 Reg

也許你應該只使用本地懸停事件，你可以延遲添加到它也：

var time = false; 
$(".dropDown").hover(function() { 
    if ($("dropPanel", this).is(":hidden")) $("dropPanel", this).slideDown('fast'); 
    else window.clearTimeout(timer); 
}, function() { 
    var obj = $(this); 
    timer = window.setTimeout(function() {obj.slideUp(100);}, 150); 
});

來源

2010-12-01 12:14:13

hoverIntent在選定元素上觸發'out'功能

回答

相關問題