隐藏其他列表元素时，悬停在一个列表项目

Question

我有一个unidrr列表li元素，当我将鼠标悬停在一个元素上，我想隐藏其他元素。我如何用jQuery来做到这一点。

<ul class='sidebar-iproducts-ul'> 
    <li>IPuzzles</li> 
    <li>IPuzzles</li> 
    <li>IPuzzles</li> 
    <li>IPuzzles</li> 
    <li>IPuzzles</li> 
    <li>IPuzzles</li> 
</ul> 

Answer 1

看看这个fiddle

的JS

$('ul.sidebar-iproducts-ul li').mouseover(function(){ 
    $(this).siblings().css('visibility', 'hidden'); 
}); 

$('ul.sidebar-iproducts-ul li').mouseout(function(){ 
    $(this).siblings().css('visibility', 'visible'); 
}); 

风格

li{ 
display: block; 
width: 100px; 
} 

Answer 2

var $items = $("ul.sidebar-iproducts-ul").children("li"); 
$items.hover(function() { 
    $items.fadeOut(); 
    $(this).show(); 
}); 

也许它会帮助你。

Answer 3

可能是你可以这样写

$('.sidebar-iproducts-ul li').hover(function(){ 
    $('li').css('display', 'none'); 
    $(this).css('display', 'block'); 
});