jquery - 悬停缩略图时使用 jquery 更改主图像

Question

我正在寻找类似 this 的内容如果我将鼠标悬停在缩略图上，主图像就会发生变化。但有一个问题，因为我还需要像 fancybox 这样的东西 - 单击主图像或缩略图将显示大图像。此外，一行中应该有缩略图照片库，如果缩略图多于四个，则将有向右/向左箭头用于移动图库。有没有包含我所有要求的解决方案？

Answer 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)");
});

在这里工作 fiddle :http://jsfiddle.net/RyDqX/

希望对您有帮助。