下面我们就结合简单的代码示例，给大家介绍jquery实现图片翻转效果的方法。
代码示例如下：
<!DOCTYPE HTML><HTML lang="en"><head> <Meta charset="utf-8"> <Title>jquery实现图片翻转效果示例</Title> <style> .card{ margin: 30px; } </style> <script src="https://code.jquery.com/jquery-1.12.4.min.Js"></script> <script> $(function () { $("img").click(function(){ // 改变图片的src属性 $(this).attr("src", "./images/1.jpg"); }); }); </script></head><body><div class="card"> <img src=".images/2.jpg" alt="Poker Card"></div></body></HTML>这里我们首先定义了一张图片（2.jpg），然后给这张图片添加一个点击事件，当点击这张图片时就触发attr() 方法，改变图片的src属性，也就是更换另一张图片（1.jpg）。
最终实现图片翻转效果如下所示:
attr() 方法可以设置或返回被选元素的属性值。根据该方法不同的参数，其工作方式也有所差异。
注：当该方法用于返回属性值，则返回第一个匹配元素的值。
当该方法用于设置属性值，则为匹配元素设置一个或多个属性/值对。
本篇文章就是关于jquery实现图片翻转效果的具体实现方法介绍，简单易懂，希望对需要的朋友有所帮助！ 总结
以上是内存溢出为你收集整理的如何用jquery实现图片翻转效果全部内容，希望文章能够帮你解决如何用jquery实现图片翻转效果所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）