Jquery 函数错误
我面临 jquery 函数的问题。当访问者将其鼠标指针移到标题的背景图像上时，我希望我的标题不会消失半秒。
这是主页，有时当你集中注意力时，你会意识到在孩子的卡通片上，它说“你好”，但有时它会在很短的时间内消失。我希望当您将鼠标指针移到它上面时它不会被隐藏。
I'm facing a problem of a jquery function . I want my header not to vanish for a half second while Visitor moves his/her mouse pointer over the header's background image.
Here's the home page where you'll realise that sometimes when you focus over the child's cartoon it says "hello" but though sometimes it becomes invisible for a very short moment. I want it not to be hidden when you moves your mouse's pointer over it.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
这大部分与 jQuery 无关。
不要在悬停状态下使用不同的图像，而是使用精灵图像并使用 jQuery 更改背景位置，这将允许两个图像之间的无缝过渡。
http://css-tricks.com/158-css-sprites/
This is not related to jQuery, well mostly.
Instead of using a different image for hovered state use a sprite image and change background position with jQuery, that'll allow a seamless transition between two images.
http://css-tricks.com/158-css-sprites/
这不是 jQuery 的问题。
发生这种情况是因为当您将鼠标移到标题上时，悬停图像尚未加载，因此浏览器必须在需要时下载它，这可能需要一些时间。
您基本上有两个选择：
预加载您的图像，这样，即使不是立即需要它们，它们也会被加载，并且当您需要它们时，它们就可以显示了。
使用包含普通图像和悬停图像的单个图像，这称为精灵。这样，完整的图像将被加载，您将不会再遇到这个问题。然后，您需要更改背景位置以显示其他图像。您可以通过在 CSS 规则中创建具有不同背景位置坐标的不同类来实现此目的。使用 JS，您只需要在鼠标悬停在标题上时分配此类即可显示它。
如果您不想手动完成此操作，也可以使用在线工具来完成这项工作。通常不鼓励使用这些工具，但对于相同大小的两个图像，我认为它们是可以的。
It's not a jQuery problem.
This happens because the hover image has not been loaded yet when you move your mouse over the header, so the browser has to download it when needed, and it may take some time.
You have basically two options:
Preload your images, so that they will be loaded even if not immediately needed, and when you need them they are ready to be displayed.
Use a single image containing both the normal image and the hover image, this is called a sprite. This way the full image will be loaded and you won't face this problem anymore. You then need to change the background position to display the other image. You can do this by create a different class in your CSS rules, with the different background position coordinates. With JS you only need to assign this class when the mouse is over the header ti display it.
If you don't want to do it manually, there also online tools which can make the job for you. Usually the use of those tools is discouraged, but for two images of the same size I think they are ok.
我认为您需要在 JavaScript 中提前预加载图像的 :hover 版本，以便在发生悬停事件时它已经被缓存。
I think you need to pre-load the :hover version of the image early in your javascript, so that it is already cached when the hover event occurs.