博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Ideal-image-slider 幻灯片
阅读量:4486 次
发布时间:2019-06-08

本文共 842 字,大约阅读时间需要 2 分钟。

在线实例

 默认效果

 淡入淡出

 带链接

 项目导航

 带标题描述

 回调函数

 自定义切换

使用方法

  1. <div class="demo">
  2.     <div id="slider">
  3.         <img src="/api/jq/5733e32bf23bb/img/1.jpg" data-src-2x="/api/jq/5733e32bf23bb//img/1@2x.jpg" alt="">
  4.         <img data-src="/api/jq/5733e32bf23bb/img/2.jpg" data-src-2x="/api/jq/5733e32bf23bb//img/2@2x.jpg" alt="">
  5.         <img data-src="/api/jq/5733e32bf23bb/img/3.jpg" data-src-2x="/api/jq/5733e32bf23bb//img/3@2x.jpg" alt="">
  6.         <img data-src="/api/jq/5733e32bf23bb/img/4.jpg" data-src-2x="/api/jq/5733e32bf23bb//img/4@2x.jpg" alt="">
  7.     </div>
  8. </div>
  9. <script src="/api/jq/5733e32bf23bb/js/ideal-image-slider.min.js"></script>
  10. <script src="/api/jq/5733e32bf23bb/extensions/bullet-nav/iis-bullet-nav.js"></script>
  11. <script>
  12. var slider = new IdealImageSlider.Slider('#slider');
  13. slider.addBulletNav();
  14. slider.start();
  15. </script>
复制

 

转载于:https://www.cnblogs.com/niuboren/p/5751809.html

你可能感兴趣的文章
CentOS7 对比 CentOS6
查看>>
Android之条码扫描二维码扫描
查看>>
C++ ofstream和ifstream
查看>>
方法--动手又动脑 2018/10/14
查看>>
工作日志WebRoot--时间插件弹出层被遮挡
查看>>
常用的按键/输入口检测程序
查看>>
清晰易懂!关于PS入门的超详细笔记!
查看>>
linux下系统对于sigsegv错误时的处理
查看>>
Bat脚本学习-5:Oracle自动备份还原脚本
查看>>
洛谷 P4248: bzoj 3238: [AHOI2013]差异
查看>>
PHP中利用PHPMailer配合QQ邮箱实现发邮件
查看>>
sql 同一张表查询不同数据合并之后关联查询
查看>>
浅谈http请求数据分析
查看>>
linux下错误的捕获:errno和strerror的使用
查看>>
LeetCode | 区间合并
查看>>
Vue实现对数组、对象的深拷贝、复制
查看>>
linux之epoll
查看>>
分区分表
查看>>
快速将yum/dnf/apt-get等默认源改为国内源
查看>>
js & Number & String
查看>>