用jquery交换图像src

前端之家收集整理的这篇文章主要介绍了用jquery交换图像src前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个大图像和小拇指,我试图互相交换他们的src.这里我在bottleWrapper img中更改拇指img,但我想交换他们的src.请帮忙!

HTML

<div class="bottlesWrapper">
  <img src="bottle1.png" />
</div>

<div class="thumbs">
   <img src="bottle2.png" />
</div>

脚本

<script>
$('.thumbs a').each(function() {
    $(this).click(function() {
       var aimg = $(this).find("img")

      $('.bottlesWrapper img').fadeOut('fast',function(){
         $(this).attr('src',$(aimg).attr('src')).fadeIn('fast');
      });

    });
});
</script>

编辑

谢谢大家:)

我实际上忘了给出一个我有各种拇指的信息,这个答案最适合!谢谢大家的宝贵意见!

$('.thumbs img').click(function() {
    var thmb = this;
    var src = this.src;
    $('.bottlesWrapper img').fadeOut(400,function(){
        thmb.src = this.src;
        $(this).fadeIn(400)[0].src = src;
    });
});

解决方法

要SWAP图像,请执行以下操作:

LIVE DEMO

$('.thumbs img').click(function() {
    var thmb = this;
    var src = this.src;
    $('.bottlesWrapper img').fadeOut(400,function(){
        thmb.src = this.src;
        $(this).fadeIn(400)[0].src = src;
    });
});

如果您有多个’画廊’,请执行以下操作:http://jsbin.com/asixuj/5/edit

原文链接:https://www.f2er.com/jquery/175611.html

猜你在找的jQuery相关文章