如果图像未悬停，则隐藏 div

Posted 2023-03-05

【中文标题】如果图像未悬停，则隐藏 div

【英文标题】：Hide div if image is not hover

【发布时间】：2011-12-12 21:12:32

【问题描述】：

好的，我已经阅读了各种类似的问题，但我没有找到针对我的特定问题的答案。在我的网站上，我有一个图像列表，可以在悬停时放大，并且该图像旁边的 div 会显示它是哪种类型的图片。鼠标移出 div 消失，图像恢复到以前的状态。如果我一张一张慢慢地悬停在图像上，一切正常，但是当我将一些图像悬停得相当快时，所有 div 都会出现并保持可见，即使图像不再悬停。所以我的问题是：如何设置它，即使我快速悬停图像，div 也会消失？

$("ul.graphThumbs li").hover(function() 
    $(this).find(".graphInfo").css("z-index":"9999").hide().delay(300).fadeIn(700);
,function()
    $(".graphInfo").hide();
);

我需要像if ("ul.graphThumbs li") 这样的东西，然后(".graphInfo").hide() 没有悬停。这样(".graphInfo") 只有在某些("ul.graphThumbs li") 悬停时才能显示。 希望我已经足够清楚了。

【问题讨论】：

副手我建议不要在你的隐藏选择器上如此模糊。确保在隐藏时使用与在节目中相同的find()。

【参考方案1】：

使用css

div.aboutdisplay:none;
img:hover + div.aboutdisplay:block;

作为一个简单的例子 http://jsfiddle.net/lastrose/ssHRd/

如果你想坚持使用 jquery，.stop() 并在开始另一个动画之前清除队列。

$("ul.graphThumbs li").stop(true)

【参考方案2】：

$("ul.graphThumbs li").hover(function() 
    $('.graphInfo').stop(true);  
    $(this).find(".graphInfo").css("z-index":"9999").hide().delay(300).fadeIn(700);
,function()
    $(".graphInfo").hide();
);