我的生活（）方法去瘋狂

我有很多元素，如認爲：

<section class="item> 
    <div class="caption"> 
    </div> 
</section>

的「標題」是隱藏的，當你走在「項目」中的「標題「進來了。

我之前用hover（）做了這個，工作正常，但現在我需要它live（），因爲我用ajax（）調用添加了更多的」item「。

現在發生的情況是，當顯示「標題」時，它優先於項目，因爲它的風格是絕對的。這裏是一些其他代碼：

.caption { 
    position: absolute; 
    top: 0; 
    right: 0; 
    left: 0; 
    bottom: 0; 
    z-index: 5; 
    display: none; 
}

我喜歡這種風格，因爲有時我的「項目」可以有任何大小，和「標題」只是緊隨其後。但讓我們繼續。

症狀：當我鼠標進入我的「項目」時，標題顯示，然後立即消失，然後進入，然後熄滅。像瘋了一樣。我知道爲什麼，我想這是因爲我的「標題」即使居住在「項目」中也是優先的，所以「項目」在鼠標輸入事件中不再存在。所以「標題」離開，「項目」觸發另一隻鼠標輸入。等等，直到時間結束。

這裏是我的javascript，我怎麼說生活（）像行爲就像之前用懸停（）？

$('.item').live({ 
    mouseenter : function() { 
     $(this) 
     .find('.caption') 
     .animate({ 
      opacity: 1, 
      height: 'toggle' 
      }, 'fast'); 

    }, 

    mouseout : function() { 
     $(this) 
     .find('.caption') 
     .animate({ 
      opacity: 0, 
      height: 'toggle' 
     }, 'fast');  

    } 

})

謝謝！

來源

2012-01-11 Daniele

我相信'mouseout'應該是'mouseleave' – 2012-01-11 19:30:42

對您的問題沒有多大幫助，但請注意'live'在jQuery 1.7+中已棄用。如果您使用的是1.7+，請使用'on'。如果你不是，請使用'delegate'代替。 – 2012-01-11 19:31:25

以下是關於.live（）的jQuery文檔的報價單：從jQuery 1.7開始，.live（）方法已被棄用。使用.on（）附加事件處理程序。老版本的jQuery用戶應優先使用.delegate（），而不要使用.live（）。 – 2012-01-11 19:33:58

mouseout應該是mouseleave正確模擬$.fn.hover方法。

來源

2012-01-11 19:43:48

如果有人關心，這是因爲mouseout是默認的javascript事件，只要光標離開元素就會觸發，即使它是針對同一元素的子元素，而mouseleave是jQuery的改進版本，它不會計入輸入一個孩子離開元素。 – Dave 2012-01-11 19:52:37

我花時間來測試這個，所以我的答案有點晚了。下面是使用mouseleave證明

http://jsfiddle.net/DvReQ/

Dave解釋了爲什麼mouseout不起作用，但mouseleave作用：

這是因爲鼠標移出是默認的JavaScript事件，這將觸發只要光標離開元素，即使它是爲同一元素的子元素，而mouseleave是jQuery的改進版本，它不包括輸入子元素作爲離開元素

來源

2012-01-11 19:47:02 Hubro

我的生活（）方法去瘋狂

回答

相關問題