simpleGal小图切换大图插件

simpleGal小图切换大图插件

一款简单的jQuery图片相册插件simpleGal,小图切换大图,当然你也可以用jQuery attr属性直接替换。

淘建站为您提供更多_图片代码_图片插件_缩略图_切换,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 460 次

下载资源

52 积分

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。

HTML

首先我们在.gallery上放置第一张大图,在.thumbnails放置缩略图

<div class="gallery">
    <div class="main-image">
        <img src="images/big1.jpg" alt="Placeholder" class="custom">
    </div>

    <ul class="thumbnails">
        <li><a href="images/big1.jpg"><img src="images/thumbnail1.jpg" alt=""></a></li>
        <li><a href="images/big2.jpg"><img src="images/thumbnail2.jpg" alt=""></a></li>
        <li><a href="images/big3.jpg"><img src="images/thumbnail3.jpg" alt=""></a></li>
        <li><a href="images/big4.jpg"><img src="images/thumbnail4.jpg" alt=""></a></li>
        <li><a href="images/big5.jpg"><img src="images/thumbnail5.jpg" alt=""></a></li>
    </ul>
</div>

调用simpleGal插件

$(function() {
    $('.thumbnails').simpleGal({
        mainImage: '.custom'
    });
});

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/234.html
simpleGal小图切换大图插件 希望对你有帮助,感谢您的支持!
  • baguetteBox图片弹出层插件

    baguetteBox图片弹出层插件

  • jQThumb缩略图插件 - 让缩略图正常显示而不变形

    jQThumb缩略图插件 - 让缩略图正常显示而不变形

  • tabslet制作世界杯时间轴幻灯片

    tabslet制作世界杯时间轴幻灯片

  • least.js响应式画廊插件演示

    least.js响应式画廊插件演示

  • Orbit演示jQuery三种不同的幻灯片效果

    Orbit演示jQuery三种不同的幻灯片效果

  • Fakecrop整齐的显示你的缩略图

    Fakecrop整齐的显示你的缩略图

  • allinone rotator演示40种不同的焦点图轮播

    allinone rotator演示40种不同的焦点图轮播

  • jQuery仿搜狗响应式整屏切换效果

    jQuery仿搜狗响应式整屏切换效果

  • jQuery可预览缩略图的滑动插件

    jQuery可预览缩略图的滑动插件

  • jQuery仿QQ空间响应式相册插件

    jQuery仿QQ空间响应式相册插件

  • jQuery快速切换商品图片

    jQuery快速切换商品图片

  • Cufon圆形缩略图焦点图轮播插件

    Cufon圆形缩略图焦点图轮播插件

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2