jQuery图片切换点击缩略图展示大图

立即领取

最高 ¥2000 红包 限量领取

云服务器、主机等产品通用,可叠加官网常规优惠使用 | 限时领取

源码说明

jQuery图片切换点击缩略图展示大图,此源码可左右滑动, 可调整大图进行放大、缩小、旋转、拖拽等操作,可用作图集图片展示。

源码效果图

jQuery图片切换点击缩略图展示大图

源码使用

<div style="width: 520px;margin: 30px auto;">
    <div class="img-content">
        <div class="small-img">
            <span class="left"><</span>
            <span class="right">></span>
            <ul>
                <li><img class="moveimg" src="photos/a1.png" /></li>
                <li><img class="moveimg" src="photos/a2.png" /></li>
                <li><img class="moveimg" src="photos/a3.png" /></li>
                <li><img class="moveimg" src="photos/a4.png" /></li>
                <li><img class="moveimg" src="photos/a5.png" /></li>
                <li><img class="moveimg" src="photos/a1.png" /></li>
                <li><img class="moveimg" src="photos/a2.png" /></li>
                <li><img class="moveimg" src="photos/a3.png" /></li>
            </ul>
        </div>
 
        <div class="big-img">
            <img src="" />
        </div>
    </div>
</div>

按照上面格式写HTML,然后把css和js引入就可以了。此款源码功能比较简单实用,代码也方便改动。喜欢的可以下载下来进行研究,源码不定时更新,请持续关注本站,以便获取最新版jQuery图片切换点击缩略图展示大图源码!

赞 (9) 打赏 下载
  • 欢迎小伙伴加入,本站原创文章交流群:进站必看
  • 本作品是由 白露博客 会员 白露 投递的作品。
  • 网络媒体或个人转载请务必署名并注明出处和链接!:http://blmoe.cn/759.html
  • 凡是原创作品,禁止再次修改后发布;任何商业用途均须联系作者。如未经授权用作他处,作者将保留追究侵权者法律责任的权利。

评论 0

收起表情
  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

「赠人玫瑰,手留余香」

支付宝扫一扫打赏

微信扫一扫打赏