Question

我正在制作一个悬停下拉列表，其中包含为访问者列出的Google+，Facebook，Youtube和Twitter社交窗口小部件，只需点按一次＆＃34;他们每个人都没有关闭小组。

我从简单的jquery下拉菜单开始，将其简化为单个ul li div，因此在鼠标悬停单个菜单项（Socialize）时，它会显示包含所有4个社交窗口小部件的div。到现在为止还挺好。只要您将鼠标悬停在单个菜单项或包含4个社交窗口小部件的div上，它就会保持可见状态，并且移动到div之外会使其隐藏。

我遇到的问题是，Google+小部件有一个“关注”按钮，在鼠标悬停时，会打开它自己的小型下拉菜单，以选择您要选择的圈子。当这个Google+下拉菜单出现时，父母会失去＆＃34;焦点＆＃34;缺乏一个更好的术语，并含有div隐藏。我试图深入查看Google+小部件并手动选择一些div添加到我的简单jquery下拉脚本中，但没有运气。

当Google+小部件“关注”按钮悬停时，是否有人知道如何保持包含div？

这是我简单的jquery。

$(function(){
    $('ul.dropdown li').hover(function(){
        $(this).addClass("hover");
        $('ul:first',this).css('left', '-200px');
        //$('ul:first',this).css('display', 'block');

    }, function(){
        $(this).removeClass("hover");
        $('ul:first',this).css('left', '-2000px');
        //$('ul:first',this).css('display', 'none');
    });
});

注释掉的两行是原始的隐藏/显示，但是由于小部件在隐藏的div中未正确加载的问题，我选择将其保持可见并简单地将其从视口的一侧移开。整个问题。我只需要解决Google+关注按钮鼠标悬停，导致父DIV消失。

编辑：这是进一步澄清的网站。 http://www.lawncaremarketingexpert.com/

Answer 1

您可以在Google+ div的鼠标悬停事件中使用'event.stopPropagation（）'。像这样：

$('<Google+ div selector>').mouseover(function(e){
 e.stopPropagation();
});

解决方法：

$('<Google+ div selector>').mouseover(function(e){
     jQuery('<parent dropdown panel selector>').show();
  });

包含隐藏/显示DIV隐藏在Google+关注按钮的鼠标悬停中

1 个答案: