手机版滑动效果

<script type="text/javascript" src="../script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../script/hammer.min.js"></script>
    
    <!--滑动效果1-->
    var element = document.getElementById('test_el'),
         _left = 0,_width= $(window).width(),
        hammertime = Hammer(element);
        hammertime.on("swipeleft", function(event) {
            var leftWidth = $('.main-list li').length * $('.main-list li').width() - _width;
                _left += 200;
                if(_left > leftWidth){
                    _left = leftWidth;
                }
                
                $('.main-list').animate({left:-_left},500);
        });
        hammertime.on("swiperight", function(event) {
            _left -= 200;
            if(_left < 0){
                _left = 0;
            }
            
            $('.main-list').animate({left:-_left},500);
        });

posted @ 2014-12-26 18:03  xiaofeng1983  阅读(92)  评论(0)    收藏  举报