使用 jquery 显示和隐藏 div，与 mashable.com 网站相同

Question

http://mashable.com/

我有这个脚本：

$(document).ready(function(){
    $(".show_hide5").mouseover(function(){
        $('.selected').removeClass('selected');
        $(this).next().fadeIn("slow").addClass('selected');
        $(".slidingDiv5").not('.selected').fadeOut("slow");
    });

    $('.selected').removeClass('selected');
    $(this).next().fadeIn("slow").addClass('selected');
    $(".slidingDiv5").not('.selected').fadeOut("slow");
});

到目前为止，这个脚本运行良好，但它仍然缺少一些东西，现在它在鼠标悬停时在箭头上显示 div，正如你可以在 mashable 网站上看到的那样，但共享区域不会隐藏在 mouseout 上，它只隐藏一次你把鼠标放在另一个箭头上。

我只需要在鼠标移出时隐藏共享区域。

提前致谢。

Answer 1

如果我理解得很好，您想在mouseleave 事件中淡出.slidingDiv5：

$(document).ready(function(){
   $(".show_hide5").mouseover(function(){
       $('.selected').removeClass('selected');
       $(this).next().fadeIn("slow").addClass('selected');
       $(".slidingDiv5").not('.selected').fadeOut("slow");
   });
   $(".show_hide5").mouseleave(function(){
       $(".slidingDiv5").fadeOut("slow");
   });
});