我面临一个 jquery 函数的问题。当访客将他/她的鼠标指针移到标题的背景图像上时，我希望我的标题不会消失半秒钟。
在主页上，您会发现有时当您专注于孩子的卡通画时，它会说“你好”，但有时它会在很短的时间内变得不可见。当您将鼠标指针移到它上面时，我希望它不会被隐藏。
问问题
108 次
3 回答
1
这与 jQuery 无关，主要是。
不用为悬停状态使用不同的图像，而是使用精灵图像并使用 jQuery 更改背景位置，这将允许两个图像之间的无缝过渡。
于 2011-09-12T07:38:14.407 回答
0
这不是 jQuery 问题。
发生这种情况是因为当您将鼠标移到标题上时尚未加载悬停图像，因此浏览器必须在需要时下载它，并且可能需要一些时间。
你基本上有两个选择：
预加载您的图像，以便即使不是立即需要它们也会被加载，并且当您需要它们时，它们就可以显示了。
使用包含普通图像和悬停图像的单个图像，这称为sprite。这样，完整的图像将被加载，您将不再面临这个问题。然后，您需要更改背景位置以显示其他图像。你可以通过在你的 CSS 规则中创建一个不同的类来做到这一点，具有不同的背景位置坐标。使用 JS，您只需要在鼠标悬停在标题上时分配此类即可显示它。
如果您不想手动完成，还有在线工具可以为您完成这项工作。通常不鼓励使用这些工具，但对于两个相同大小的图像，我认为它们是可以的。
于 2011-09-12T07:43:09.530 回答
0
我认为您需要在 javascript 中提前预加载图像的 :hover 版本，以便在发生悬停事件时已经缓存它。
var img = new Image();
img.src = "http://www.kidsartvalley.com/images/child-head-hover.png";
于 2011-09-12T07:44:27.863 回答