jQuery的懸停怪事當孩子

http://jsfiddle.net/GNQyt/jQuery的懸停怪事當孩子

將鼠標懸停在綠框，然後移動鼠標來的孩子名單。突然開始像瘋了一樣閃爍，反正爲了防止這個但保持懸停在兒童？

* 後來編輯

2012-02-10 Brian

這是您的工作代碼http://jsfiddle.net/GNQyt/18 我使用了延遲方法。一旦你離開.icn達到ul你有1000毫秒。如果您在所需的時間內點擊ul，則淡出它的請求將被刪除。

$('.icn').on({ 
    mouseenter: function() { 

     clearTimeout($(this).data('timeoutId')); 

     $(this).children('ul').show('fast'); 
    }, 
    mouseleave: function() { 

     var self = this; 

     var timeoutId = setTimeout(function() { 
      $(self).children('ul').hide('fast'); 
     }, 1000); 

     $(self).data('timeoutId', timeoutId); 
    } 
});

來源

2012-02-10 23:13:55 danwit

這是您的工作代碼 - > http://jsfiddle.net/GNQyt/18/延遲設置爲1000毫秒 – danwit 2012-02-10 23:20:44

謝謝，我相信這將是我當前網站的最簡單解決方案。 :) – Brian 2012-02-10 23:26:09

歡迎:) – danwit 2012-02-10 23:27:45

http://jsfiddle.net/GNQyt/5/

使用了mouseenter，而不是在這種情況下，

這裏徘徊是「的MouseEnter」的一個不錯的互動比較與「鼠標懸停」 http://api.jquery.com/mouseover/

該Demo非常清楚。

來源

2012-02-10 22:44:49 danwit

這似乎隱藏子完全不過，我想它保持對父母一方或子女懸停狀態，並隱藏在鼠標離開，只是抑制閃動時，我搬過來的孩子。 – Brian 2012-02-10 22:52:31

閃爍是由遠離綠色框和彈出窗口而產生的。由於您離開了綠色框，計算機之間的距離會導致計算機關閉彈出窗口，但在彈出窗口完全關閉之前，鼠標到達彈出窗口，導致它再次打開。理想情況下，兩者應該相交，以允許鼠標直接從框移動到彈出窗口。或者，在關閉彈出窗口之前增加延遲時間。

來源

2012-02-10 22:56:47

我會如何準確地增加延遲？使用「setTimeout（function（）{$（this）.children（'ul'）。toggle（'fast'）;}，200）」似乎完全消除了懸停。 – Brian 2012-02-10 23:09:25

閃爍並不是因爲懸停孩子，而是在關閉時捕捉菜單。移動top: 0px; left: 0px;左上方的菜單解決了這個問題。另外通過height: 500px; width: 500px;改變跨度的高度和寬度也解決了。爲了使高度和寬度有效，將跨度改爲div。

來源

2012-02-10 22:58:13 sevenkul

不幸的是，該列表是爲了從跨度分離。這是一個圖標，可以彈出一個對話框，但彈出窗口的其中一個也可以有鏈接，因此我需要維護懸停。 – Brian 2012-02-10 23:10:35

http://jsfiddle.net/GNQyt/17/

這裏有一個擊中格另一種解決方案。這是一個非常黑，但我想你會得到一個感覺出它:)

請記住，

<span> 
    <div> 
    </div> 
</span>

是非法操作，因爲你不應該換塊元素爲行內元素。

來源

2012-02-10 23:07:45 danwit

jQuery的懸停怪事當孩子

回答

相關問題