<!-- 点击切换引入 -->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.SuperSlide.2.1.1.js"></script>

var swiper = new Swiper('.swiper-container', { //swiper轮播图
  slidesPerView: 'auto',//则自动根据slides的宽度来设定数量
  centeredSlides: true,//active slide会居中,而不是默认状态下的居左
  slideToClickedSlide: true,//可以点击切换
  onlyExternal:true,//无法拖动
  initialSlide: self.hour_type, //设置为2后,Swiper初始化时activeSlide成了第三个
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
  onTransitionEnd: function (swiper) {
    回调
  }
});

 

效果展示:http://www.superslide2.com/demo.html

SuperSlide轮播切换的更多相关文章

  1. SuperSlide轮播插件滚动高度或宽度不对的问题解决

    声明:本文由w3h5原创,转载请注明出处:<SuperSlide轮播插件滚动高度或宽度不对的问题解决> SuperSlide 是一款比较实用的轮播插件,网站上常用的“焦点图/幻灯片”“Ta ...

  2. JS图片自动和可控的轮播切换特效

    点击这里查看效果:http://hovertree.com/texiao/js/1.htm HTML文件代码如下: <!DOCTYPE html> <html xmlns=" ...

  3. 一款基于jQuery轮播切换焦点图,可播放多张图片

    今天给大家分享一款基于jQuery轮播切换焦点图,可播放多张图片,在这个组件中,你可以任意指定8张图片,然后插件就会帮你自动生成缩略图,并且自动开始切换播放图片.当然,你也可以手动切换图片,只要点击缩 ...

  4. 3D轮播切换特效 源码

    这个3D轮播切换特效是我2017年2月份写的 当初我 刚接触HTML不久,现在把源码分享给大家 源码的注释超级清楚 . <!-- 声明文档类型:html 作用:符合w3c统一标准规范 每个浏览器 ...

  5. 基于jquery带时间轴的图片轮播切换代码

    基于jquery图片标题随小圆点放大切换.这是是一款带时间轴的图片轮播切换代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="decoroll2 ...

  6. jQuery实现轮播切换以及将其封装成插件(3)

    在前两篇博文中,我们写了一个普通的轮播切换.但是我们不能每一次需要这个功能就把这些代码有重新敲一次.下面我们就将它封装成一个插件. 至于什么是插件,又为什么要封装插件,不是本文考虑的内容.  我们趁着 ...

  7. jQuery实现轮播切换以及将其封装成插件(2)

    在上一篇博文中,我们完成了一个简单的轮播切换.它的功能比较简单,仅仅能定时切换图片. 但是有没有这样一种情况.当我们特意的想看某一个轮播显示项时不希望等轮播一圈才能等到,希望通过图上的一些元素,触发某 ...

  8. jQuery实现轮播切换以及将其封装成插件(1)

    我们在网上经常会看到一些轮播切换的效果.轮播切换,就是在一个有限的空间中定时的像走马灯一样去播放一组图片,当然也可以通过鼠标悬停在小按钮上来切换显示.下面我们将一步一步的实现这一效果. 为保证效果,请 ...

  9. jQuery - 广告图片轮播切换

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. Ribbon 负载规则替换

    1 添加规则类: 注意: 官方文档明确给出了警告: 这个自定义配置类不能放在 @ComponentScan 所扫描的当前包下以及子包下,否则自定义的配置类就会被所有的 Ribbon 客户端所共享,达不 ...

  2. mongoose.model第三个参数的问题

    这个是个好问题,之前按照教程做的数据库没有问题,现在自己从新做出现了问题.还好之前有无意中接触了这个知识点,不然感觉真的很难解决. 在检查完所有东西都没错的时候(前端传给req的数据正常,与数据库相符 ...

  3. 使用 eval(input()) 的便利

    输入列表或者字典时使用eval可以自动转换为其类型 2020-06-18

  4. bzoj 4448 [Scoi2015]情报传递 主席树

    比较套路的题目. 可以发现难点在于某个点的权值动态修改 且我们要维护树上一条路径上的点权>x的个数. 每个点都在动态修改 这意味着我们的只能暴力的去查每个点. 考虑将所有可以动态修改的点变成静态 ...

  5. 获取判断IE版本 TypeError: Cannot read property 'msie' of undefined

    注意:以下方法只适用于IE11 以下: TypeError: Cannot read property 'msie' of undefined jquery1.9去掉了 $.browser  所以报错 ...

  6. layer.js : n.on is not a function

    当时使用的jQuery为1.4.x的版本.换成高版本就好了. 参考 https://blog.csdn.net/marswill/article/details/69316003

  7. odoo自定义模块项目结构,odoo自定义模块点安装不成功解决办法

    如图所示:在odoo源码的根目录中创建自己的项目文件(project) 在odoo.conf配置文件中的addons_path路径中加入自己项目的文件夹路径,推荐使用绝对路径 addons_path ...

  8. day6. while双项循环及for循环

    一.双向循环经典练习 1.打印十行十列小星星(2个循环) # j 外循环用来控制行数 j = 0 while j<10: # 打印一行十个星星 i = 0 while i <10: # 写 ...

  9. Spring 参数注入

    一个(类)Bean可能包含多种属性,这些属性怎么配置???  见下: 用People  Dog Cat Tiger  Panda五个类来学习一些常用的=_= 重点在XML <!--基本类型注入- ...

  10. 当asp.net core偶遇docker一(模型验证和Rabbitmq 一)

    比如我们有一些设计,依赖于某些软件,比如rabbitmq 当管理员功能,反复错误三五次之后,就发送一条消息到队列里去,我们又不希望对原先设计带来侵入式的改变业务 这个时候,我们就可以在模型验证里面加入 ...