鼠標懸停並將鼠標移出隱藏dom元素與jquery

我想隱藏一個dom元素，當您將其懸停時。我想顯示它下面的div。問題是，當第一個元素隱藏時，jquery不再看到懸停，並將懸停div回來。所以div切換得非常快。鼠標懸停並將鼠標移出隱藏dom元素與jquery

當鼠標移出div區域時，我想要「前」。

<div class="blockLong front" ></div> 
<div class="blockLong"></div>

的div被放置在eatchother具有絕對位置和大小都一樣

這是jQuery的：

$('.front').hover(function() 
{ 
    $(this).hide(); 
}); 

$('.front').mouseout(function() 
{ 
    $(this).show(); 
});

來源

2012-12-17 user1386906

將不透明度設置爲0。 – Shmiddty

我想把它完全隱藏起來，不是不透明0 – user1386906

爲什麼-1，我的問題有什麼不對？ – user1386906

爲了保持一致性，你應該hover獨佔使用：

$('.front').hover(function(){ 
    $(this).fadeTo(500,0); 
}, function() { 
    $(this).fadeTo(500,1); 
});

這樣做的效果是爲每個o添加一個處理程序f mouseenter和mouseleave。

如果你不想div時你mouseleave事件已觸發回，你可以試試這個：

$('.front').mouseenter(function(){ 
    $(this).fadeOut(500); 
}); 

$('blockLong:not(.front)').mouseleave(function(){ 
    $('.front').fadeIn(500); 
})

來源

2012-12-17 20:37:43

我想完全隱藏它，而不是0 – user1386906

@ user1386906當您將不透明度設置爲0時，它*完全不可見。 –

是它的不可見的，但是當我在下面的div的鏈接我不能點擊它們 – user1386906

試試這個：

<div class="blockLong front"></div> 
<div class="blockLong back"></div>

$('.front').hover(function() 
{ 
    $(this).hide(); 
}); 

$('.back').mouseout(function() 
{ 
    $(".blockLong.front").show(); 
});

來源

2012-12-17 20:47:56 Shmiddty

thx爲你的anwser，但我有很多這些塊。我自己找到了一個安慰者 – user1386906

@ user1386906將來一定要更徹底地解釋你的問題。 – Shmiddty

-1

這就是我所做的：

<div class="blockLong back"></div> 
<div class="blockLong front"></div> 


$('.front').hover(function() 
{ 
    $(this).hide(); 
}); 

$('.back').mouseout(function() 
{ 
    $(this).next().show(); 
});

來源

2012-12-17 20:52:31 user1386906

爲什麼最小的一個？ – user1386906

這個解決方案有什麼問題？ – user1386906

鼠標懸停並將鼠標移出隱藏dom元素與jquery

回答

相關問題