鼠标悬停图像卡住？答案

【问题标题】：On mouseover image gets stuck?鼠标悬停图像卡住？
【发布时间】：2013-06-24 14:21:50
【问题描述】：

在此页面http://www.londonsitedesign.co.uk/home.html 上，当您将鼠标悬停在列表上时，会出现弹出图像。我注意到图像有时会卡住，尤其是当我单击其中一个链接然后返回该页面时，图像仍然可见。然后，当您将鼠标悬停在该弹出图像的相同链接上时，它会反转，它会在鼠标上消失而不是出现？

$("#main").on("mouseover mouseout", "h4", function () {
$("#" + $(this).data("img")).toggle();
});

知道如何防止这种情况发生吗？

【问题讨论】：

标签： javascript jquery toggle mouseover mouseout

【解决方案1】：

我没有使用toggle()，而是为 mouseover 和 mouseout 设置单独的处理程序，如下所示：

$("#main").on('mouseover', 'h4', function () {
    $("#" + $(this).data("img")).show();
}).on('mouseout', 'h4', function () {
    $("#" + $(this).data("img")).hide();
});

当您点击Back 返回历史页面时，浏览器有时无法预测页面状态。我不确定是否有办法解决这个问题 - 但至少这样，您不会被反向切换卡住。

更新

看看这些问题，了解如何防止按下后退按钮时图像仍然显示：

听起来您所要做的就是向您的页面添加一个unload 事件处理程序，以防止缓存最后一个页面状态。处理程序甚至不需要做任何事情——只要定义它就足够了。像这样的：

$(window).bind("unload", function() {});

【讨论】：