在悬停缩略图上使用 jquery 更改主图像答案

【问题标题】：On hover thumbnail change main image with jquery在悬停缩略图上使用 jquery 更改主图像
【发布时间】：2013-08-07 01:42:43
【问题描述】：

我正在寻找类似this 的内容，如果我将鼠标悬停在其中，则主图像会发生变化。但是有一个问题，因为我还需要花式框之类的东西-单击主图像或缩略图时会显示大图像。此外，一行中还应该有缩略图的照片库，如果有四个以上的缩略图，那么移动图库将有向右/向左箭头。有没有可以满足我所有要求的解决方案？

【问题讨论】：

标签： jquery hover gallery thumbnails onchange

【解决方案1】：

试试这个：

var mainImage = $("#mainImage");
$(".img-container img").hover(function(){
  var src = $(this).attr("src");
  $("#mainImage").attr("src",src);
});

mainImage.on("click",function(){
   $(this).css("transform","scale(2)");
});

在这里工作小提琴：http://jsfiddle.net/RyDqX/

希望对你有帮助。

【讨论】：

【解决方案2】：

这是一系列解决方案检查并找到正确的解决方案 http://www.hongkiat.com/blog/jquery-image-galleries-sliders-best-of/

【讨论】：

谢谢，但我不想要任何滑块或类似的东西，因为我需要在悬停而不是点击时更改图像。
它不只是像这个tn3gallery.com/?refCode=fe8775那样滑动它的画廊，你只需改变它的宽度