Div与链接消失之前，我可以使用它（jQuery的隐藏/显示）

Question

我有一个图标，当我把鼠标悬停在它上面显示一个链接的div。用户应该能够点击此链接，但当鼠标离开图标时，它会消失。有谁知道我可以如何防止这种情况发生？

代码：

$('.div1').hover(function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); 
    $(this).next().show('fast'); 
}, 
function(e){ 
    e.preventDefault(); 
    e.stopPropagation();  
    $(this).next().hide('fast'); 
}); 

我做了一个的jsfiddle，借以说明问题：

http://jsfiddle.net/2wrjG/5

Answer 1

$('.domaininfo').hover(function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    $(this).next().show('fast'); 
}, 
function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    $('.domain-info-window').hover(function (e) { 
     e.preventDefault(); 
     e.stopPropagation(); 
    }, 
    function (e) { 
     e.preventDefault(); 
     e.stopPropagation(); 
     $(this).hide('fast'); 
    }); 
}); 

DEMO HERE

Answer 2

的问题是，你离开IMG标签当你尝试点击链接。我建议将所有内容都包裹起来，然后在这个包装上调用悬停。

这里工作小提琴：http://jsfiddle.net/2wrjG/2/

$('.wrapper').hover(function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    $(this).children('a').show('fast'); 
}, 

function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    $(this).children('a').hide('fast'); 
}); 

HTML-部分：

<div class="wrapper"> 
<img class="domaininfo" src="http://domeinwinkel.sitestatus.nl/gfx/itje.png"> 
<a class="domain-info-window" id="domain-info-window-2" href="#"> 
Is deze domeinnaam bij een andere provider geregistreerd maar wil je profiteren van de voordelen van Domeinwinkel? Verhuizen naar Domeinwinkel is snel geregeld! 
</a> 
</div> 

CSS：

.domaininfo { 
    position: relative; 
    top: 0px; 
    left: 0px; 
} 

Answer 3

，当你将鼠标悬停在图像的DIV所示。 如果你想链接消失，只有当你点击它，我想这可以帮助你。

enter code here 

$('.domaininfo').hover(function (e) { 
      e.preventDefault(); 
      e.stopPropagation(); 
      $(this).next().show('fast'); 
    },function (e) { 
      e.preventDefault(); 
      e.stopPropagation(); 
      $('.domain-info-window').click(function (e) { 
       $(this).hide(); 
      }); 
     });