在循环中更改鼠标悬停时的缩略图
我有一个问题。我正在使用 WordPress，并有一个博客，其中的帖子以缩略图形式呈现。我希望当你放上鼠标时这些缩略图会发生变化。问题是我想要不同的图像更改缩略图。基本上，每个缩略图都有其独特的翻转图像。问题是我不太知道如何将 js 代码附加到循环中。以及为不同的帖子创建不同的翻转图像应该是什么样子
如果我将 js 代码附加到永久链接，它会将所有缩略图更改为同一张图片。 另外，我被告知可以用 jquery 来做。值得吗？
我试图尽可能清楚地表达
任何帮助表示赞赏！
I've got a question. I am working with wordpress and have a blog which posts are presented with thumbnails. I'd like those thumbnails change when you put your mouse on. The problem is that I want different images change thumbnails. basically, each thumbnail would have its unique rollover image. the problem is that i don't quite know how to attach js code to the loop. And how it should look like to create different rollover images for different posts
if i attach js code to the permalink, it will change all thumbnails into the same picture.
also, i was told it is possible to do with jquery. is it worthy?
i was trying to be as clear as possible
any help is appreciated!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以向每个帖子添加一个名为
hoverImg的自定义字段，该字段的值是您要用作鼠标悬停图像的图像的链接。然后，您在循环中获取链接并添加它：
该图像最初应该是不可见的，并作为缩略图的覆盖层放置。然后只需用 jquery 将其悬停即可显示。
由于我没有您的图像，因此我创建了一个带有两个 div 的 jsFiddle，一个代表您的缩略图，一个代表您的翻转图像以模仿效果：
http://jsfiddle.net/9Xa92/1/
您应该只替换
在 jsfiddle 中使用实际的缩略图（上面创建的）。You could add a custom field to each of your posts called
hoverImg, which value is the link to the image you want to use as a rollover image.Then you fetch the link in the loop, and add it:
this image should be initially invisible, and positioned as an overlay to your thumbnail. Then just show it on hover with jquery.
Since I dont have your image, I've created a jsFiddle with two divs, one representing your thumbnail, and one representing your rollover image to mimic the effect:
http://jsfiddle.net/9Xa92/1/
You should just replace the
<div class="hover-img"></div>in the jsfiddle with the actual thumbnail image (created above).