fadeToggle懸停中的下一個元素

我有下面的代碼來顯示dom中的下一個元素點擊，我想將這個相同的代碼轉換成我可以用於簡單的懸停事件。 jQuery有一個簡單的方法來做這樣的事情，或者我應該使用.bind()到mouseover和mouseout事件嗎？我知道這應該很簡單，我可能只是沒有清楚地思考。fadeToggle懸停中的下一個元素

$('#el').click(function(e){ 
    e.preventDefault(); 
    var $prevEl = $(this).parent().find('.prev-el'); 
    $prevEl.fadeToggle(); 
});

有一點要提的是我想$prevEl留徘徊在觸發#el元素之後可見。什麼是最好的方式去做這件事？

謝謝你在前進，

來源

2011-10-13 tokmak

可以使用$('#el').mouseover(...代替$('#el').click(...，但你應該使用fadeIn代替fadeToggle當你使用mouseover：

$('#el').mouseover(function(e) { 
    var $prevEl = $(this).parent().find('.prev-el'); 
    $prevEl.fadeIn(); 
});

http://jsfiddle.net/mblase75/eXjTb/3/

如果你想讓它淡出出鼠標移開時，雖然使用.hover作爲一條捷徑將兩者結合起來，並保持fadeToggle：

$('#el').hover(function(e) { 
    var $prevEl = $(this).parent().find('.prev-el'); 
    $prevEl.fadeToggle(); 
});

http://jsfiddle.net/mblase75/eXjTb/2/

來源

2011-10-13 18:33:42 Blazemonger

我忘了提到我想讓$ prevEl在懸停觸發的#el元素後保持可見狀態。什麼是最好的方式去做這件事？ – tokmak

@DmitryT用更多代碼更新了答案 – Blazemonger

感謝您的時間和幫助，我們需要這樣做，但我們將在$ prevEl元素中有可點擊的元素，因此需要在懸停時保持可見狀態，並且一旦展開，它應該淡出再次。我希望這是有道理的。 – tokmak

這應該工作：

$('#el').mouseover(function(){ 
    $(this).parent().find('.prev-el').fadeIn(); 
});

順便說一句，你可以使用.next()和.prev()而不是.parent().find(...)（取決於你的html）

來源

2011-10-13 18:41:21 Andy

fadeToggle懸停中的下一個元素

回答

相關問題