slidesjs 是基于jQuery开发的一款功能强大,是简单的幻灯片插件，但是需要要应用于移动终端的话，还需要考虑手势滑动时候图片切换功能。
此次，我就在slidesjs基础上扩展了两个swipe属性"swiperight","swipeleft"。
- // swipe right
- if (option.swiperight)
- {
- control.bind(‘swiperight‘,function(){
- if (option.play) {
- pause();
- }
- animate(‘prev‘, effect);
- });
- }
- // swipe left
- if (option.swipeleft)
- {
- control.bind(‘swipeleft‘,function(){
- if (option.play) {
- pause();
- }
- animate(‘next‘, effect);
- });
- }
这样在用slidesjs时候，只需要设置两个属性为“true”，如下：
- $(document).ready((function(){
- $(‘#slides‘).slides({
- preload: true,
- preloadImage: ‘images/loading.gif‘,
- play: 3000,
- pause: 1000,
- hoverPause: true,
- swiperight:true,
- swipeleft:true
- });
- }));
这样，WEB端网页用移动终端访问，图片滚动也能支持手势了。