轮播图

所属分类:媒体-图片展示

 65804  512  查看评论 (24)
分享到微信朋友圈
X
轮播图 ie兼容9

12种图片切换效果。

使用步骤

Html

<div id="slider">
    <img src="img/avatar.jpg" alt="" />
    <img src="img/ironman.jpg" alt="" title="Ironman Screenshot" />
    <a href=""><img src="img/imagewithlink.jpg" alt="" /></a>
    <img src="img/tron.jpg" alt="" />
</div>

js实例化

$(function(){
    window.myFlux = new flux.slider('#slider');
});

或者,如果您使用的是提供的jQuery插件,那么你也可以;

$(function(){
    window.myFlux = $('#slider').flux();
});
相关插件-图片展示

CSS3三角形图片展示

CSS3三角形图片展示
  图片展示
 39615  396

HTML5/CSS3超酷焦点图特效

焦点图插件切换效果比较简单,但是外观和功能却十分强大。该CSS3焦点图在切换图片时,图片以淡入淡出的方式缩小消失并显示下一张图片。焦点图插件还拥有一套非常大气的前后翻页按钮,是一款非常实用HTML5/CSS3焦点图应用。
  图片展示
 31927  306

纯css3放大镜

通过css3样式实现放大镜的效果
  图片展示
 42865  378

焦点效果

类似于百叶窗的效果
  图片展示
 34655  362

讨论这个项目(24)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    梦灵 0
    2021/3/30 11:01:21
    能自动吗
        西瓜0
        2021/3/30 13:41:06
        自己加一个定时器,很简单的。
    回复
    AIの①瞬□ 0
    2020/1/10 23:29:16
    你们这些人都不会改代码嘛 回复
    月下菩提 0
    2019/10/9 15:27:22
    这个能写个使用文档吗?大佬 回复
    可乐。 0
    2019/5/21 19:59:30
    0
    2019/5/13 17:42:34
    为什么不支持滑动切换 回复
    そらのおとしもの 0
    2019/3/4 17:59:45
    可以的,很厉害,不过,话说这是轮播么.....我开始怀疑人生
    回复
    . 0
    2018/11/4 20:16:50
    终于知道那些网页的效果怎样实现的了,非常棒 回复
    10° 0
    2017/12/31 16:13:07

    怎么用插件啊,导入包,不会操作- - ,急死了

    回复
    某科学の阿卡林喵S? 0
    2017/11/21 17:08:01

    很好哈,满怀感激的拿去用了

    回复
    小样 0
    2017/11/5 19:35:10

    这个可以添加手滑动事件吗?

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复