zoukankan      html  css  js  c++  java
  • slides 带手势的图片滑动效果(用于移动终端)

    slidesjs 是基于jQuery开发的一款功能强大,是简单的幻灯片插件,但是需要要应用于移动终端的话,还需要考虑手势滑动时候图片切换功能。

      此次,我就在slidesjs基础上扩展了两个swipe属性"swiperight","swipeleft"。

    1. // swipe right   
    2. if (option.swiperight)  
    3. {  
    4.     control.bind('swiperight',function(){  
    5.         if (option.play) {  
    6.             pause();  
    7.         }  
    8.         animate('prev', effect);  
    9.     });  
    10. }  
    11.   
    12. // swipe left   
    13. if (option.swipeleft)  
    14. {  
    15.     control.bind('swipeleft',function(){  
    16.         if (option.play) {  
    17.             pause();  
    18.         }  
    19.         animate('next', effect);  
    20.     });  
    21. }  

     

    这样在用slidesjs时候,只需要设置两个属性为“true”,如下:

    1. $(document).ready((function(){  
    2.    $('#slides').slides({  
    3.         preload: true,  
    4.         preloadImage: 'images/loading.gif',  
    5.         play: 3000,  
    6.         pause: 1000,  
    7.         hoverPause: true,  
    8.         swiperight:true,  
    9.         swipeleft:true  
    10.     });  
    11. }));  

    这样,WEB端网页用移动终端访问,图片滚动也能支持手势了。

    代码下载:http://dl.vmall.com/c0bvwjdbyk

  • 相关阅读:
    C++疑难杂症
    程序中的错误、异常处理框架设计
    客户端ARPG角色行为模型
    http协议
    MySQL数据库开发(2)
    MySQL数据库开发(1)
    网络编程进阶及并发编程
    网络编程-SOCKET开发
    面向对象编程
    常用模块
  • 原文地址:https://www.cnblogs.com/zhwl/p/3524793.html
Copyright © 2011-2022 走看看