Javascript 在鼠标悬停时显示/隐藏DIV

我想在图像/链接悬停上显示一个a DIV，我已经编写了以下代码

   $("#NotificationSummary").hover(
      function () {
          $("#dvNotifications").slideDown();
      },
      function () {           

          $("#dvNotifications").slideUp();
      }
    );

DIV在悬停状态下显示，但当我移动到DIV时，它会隐藏，当鼠标在上面时，如何阻止DIV隐藏

---

请查看演示

Tanveer请查看此演示：

要在悬停时显示的div应该位于要悬停的主div内，并且主div应该具有css属性：

display:block

另一个演示：

[reedit based comment]JSFIDLE修订版，删除了css专用解决方案。技巧是监视滑动元素的悬停状态，并使用超时来允许用户在滑动元素上移动（另请参见更新的JSFIDLE中的注释）

jsfiddle派生自OPs-jsfiddle

使用#ID的悬停功能：

---

}

你是怎么知道他的html结构的？@Blaster我不知道他的html结构，但我建议他使用这种结构，因为我已经在下面的帖子中建议过：@AhsanRathod回答得很好，但我正在实现facebook通知等功能，图像在头文件中，要显示的div在页面中。我已经通过css定位了div，现在只想显示/隐藏div。我正在尝试你的技术，如果你有其他想法，那么请suggest@Tanveer：查看我的另一个演示，希望它能有所帮助：@AhsanRathod请查看，我只希望如果我移动到下div，它不会隐藏，只有当指针离开两个分区时才应该隐藏。IE不工作，只是闪烁。顺便说一句，我不喜欢写特定于浏览器的东西是的，IE（第10版可能会工作，或者使用Google Chrome Frame（））。@KooiInc:Lower div永远保持打开状态，如果你从不将指针指向Lower div。请看这个演示：@Ahsan:没有什么太复杂。我已经修改了您的jsfiddle:en，并在3个浏览器中对其进行了测试。在这里工作。@Koolinc:现在没事了。。干得好请在回答中加上你的提琴。所以Tanveer可以把它标记为答案。谢谢你想通过这样做实现什么？

function hover(e){
 e = e || event;
 var el = e.target || e.srcElement
    ,showel = $('#dvNotifications')
 ;
 if (!/NotificationSummary/i.test(el.id)) {
  showel .attr('data-ishovered',/over/i.test(e.type));
 } else {
  showel .attr('data-ishovered',false)
 }

 if (/true/i.test(showel .attr('data-ishovered'))){return true;}

 if (/over$/i.test(e.type) && /NotificationSummary/i.test(el.id)){
    showel .slideDown();
 } else {
    setTimeout(function(){
        if (/false/i.test(showel .attr('data-ishovered'))) {
            showel .slideUp();
            showel .attr('data-ishovered',false);
        }
      }
    ,200);
 }

  $("#NotificationSummary").mouseenter(function() {
       $("#dvNotifications").fadeIn();
  }).mouseleave(function() {
      $("#dvNotifications").fadeOut();
  });