• swiper.js 移动端触摸滑动插件


    API链接:

              http://www.swiper.com.cn/api/start/2014/1218/140.html

    <body>
      <div class="swiper-container">
        <div class="swiper-wrapper">
          <div class="swiper-slide"><img src="images/1.jpg"></div>
          <div class="swiper-slide"><img src="images/2.jpg"></div>
          <div class="swiper-slide"><img src="images/3.jpg"></div>
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>
      </div>
      <script type="text/javascript" src="js/swiper-3.3.1.min.js"></script>
    </body>

    <script> 
    var mySwiper = new Swiper ('.swiper-container', {
      direction: 'horizontal',
      loop: false,
      initialSlide:1, //初始化页面的索引
      // 如果需要分页器
      pagination: '.swiper-pagination',
      //3d翻页
      /*
      coverflow是类似于苹果将多首歌曲的封面以3D界面的形式显示出来的方式。coverflow效果参数,可选值:
      rotate:slide做3d旋转时Y轴的旋转角度。默认50。
      stretch:每个slide之间的拉伸值,越大slide靠得越紧。 默认0。
      depth:slide的位置深度。值越大z轴距离越远,看起来越小。 默认100。
      modifier:depth和rotate和stretch的倍率,相当于depth*modifier、rotate*modifier、stretch*modifier,值越大这三个参数的效果越明显。默认1。
      slideShadows:开启slide阴影。默认 true。
      */
      effect : 'coverflow',
      slidesPerView: 2,
      centeredSlides: true,
      coverflow: {
      rotate: 0,
      stretch: 50,
      depth: 60,
      modifier: 2,
      slideShadows : false
    }
    }) 
    </script>

  • 相关阅读:
    关于程序中以时间判断接收数据结束时,接收数据长度设置为1时,出现接收不全的问题解释。
    stm32 外部8M晶振 改为12M的方法
    django iis 部署
    电信NB卡
    socketserver
    APScheduler简介
    三极管开关电路
    mysql授权
    解决VMware无法共享ubuntu虚拟机文件
    Python解析yaml配置文件
  • 原文地址:https://www.cnblogs.com/biglion/p/5977298.html
Copyright © 2020-2023  润新知