bootstrap教程|Bootstrap的Carousel配合dropload.js实现移动端滑动切换图片

更新时间:2021-07-19    来源:js教程    手机版     字体:

【www.bbyears.com--js教程】

轮播图可以通过点击按钮来跳到上一张或者下一张,在移动端我们常用的就是通过滑动来实现一些时间,那么如何实现呢。

以下是通过bootstrap的Carousel和dropload.js(移动端上下拉动刷新插件)的实现方法。

HTML部分

 

 代码如下

    

     

      

      

      

      

       

        

        

       

       

        

        

       

       

        

        

       

      

     

    

   

 

JS部分

 

 代码如下

varcarousel_=$("#carousel-example-generic0");

 $("#goods_lunbo").touchwipe({

  ReferenceMaterial:"#goods_lunbo2",//套的div

  distance : 100,//表示滑动的距离

  wipeLeftFn:function(){console.log("佐佐佐");carousel_.carousel('prev');},//向左滑动屏幕

  wipeRightFn:function(){console.log("呦呦呦");carousel_.carousel('next');},//向右滑动屏幕

  nowipe:function(){}

 });

 

本文来源:http://www.bbyears.com/wangyezhizuo/130678.html

热门标签

更多>>

本类排行