当我将鼠标悬停在它上面时,Div不会继续扩展

时间:2015-04-10 23:36:55

标签: html css hover division

所以我设计这个图片重的网站,当你将鼠标悬停在可以告诉你更多关于你正在查看的图像的图像上时,我想要显示这个框,如果你想要更多的话,可以使用链接信息。我刚刚意识到,当你将鼠标移动到这个新的div时,它就会崩溃。我不明白为什么,或者如何让它停下来。

Here is a jsfiddle

2 个答案:

答案 0 :(得分:0)

为您的包裹<div>提供类似fiddle的内容。

关键是这种css风格:

.wrapper:hover #b-image-info {
    display: block;
}

<强>更新

这应该有所帮助:

.wrapper:hover * { display:none;}
.warpper:hover #b-image, .warpper:hover #b-image-info { display: block; }

答案 1 :(得分:0)

以防万一你想要使用js / jquery。你可以这样做。 悬停时获取图像信息并更改其显示属性。

$("#b-image").hover(function(){
   $("#b-image-info").css("display", "block");
}, function(){
    //nothing
});

http://jsfiddle.net/btevfik/jq3xkm6y/