javascript - 隐藏兄弟姐妹

Question

$('#navigation li.parent').mouseover(function () {
    $('#news-ticker').hide();
    $('ul.child', this).slideDown();
});
$('#navigation .child').mouseleave(function () {
    setTimeout(function(){
        $(this).hide();
        $('#news-ticker').slideDown();
    },2000);
});

...几乎可以工作，只有一个问题，我如何隐藏 subnav 兄弟姐妹？如果我这样做$('ul.child', this).slideDown().siblings().hide();，它会隐藏整个父母。

Answer 1

只需在显示要打开的元素之前隐藏所有元素。

$('ul.child', this).hide();
$('ul.child', this).slideDown();

Answer 2

尝试：

$('#navigation li.parent').mouseover(function () {
  $('#news-ticker').hide();
  $(this).parent().find("ul.child").not($('ul.child', this)).hide();
  $('ul.child', this).slideDown();
});
$('#navigation .child').mouseleave(function (e) {
  setTimeout(function(){
      $(this).hide();
      $('#news-ticker').slideDown();
  },2000);
  e.stopPropagation();
});

Answer 3

在 slideDown 方法中，我认为您可以给它两个参数，如下所示：

slideDown(500,function(){$(this).fadeOut(500,function(){$(this).hide();});});

第一个是间隔，第二个是回调函数。完成后调用的函数。但是使用您的代码，我建议使用以下hover方法：

$('#navigation li.parent').hover(function(){
    //on mouse enter
    $('#news-ticker').hide();
    $('.child', this).slideDown(500);
},function(){
    //on mouse leave
    $('#new-ticker').slideDown(500,function(){$('.child',this).hide();});
});

很难说出没有 html 的情况下我会做什么。对不起。