html5 touch事件实现触屏页面上下滑动(二)

                    // inner.style.top=-(documentHeight-wapperHeight)+"px";   

                      $("#inner").animate({top:-(documentHeight-wapperHeight)},200);   

                     aboveY=-(documentHeight-wapperHeight);   

                  }    

            }//   

             document.getElementById("outer").addEventListener('touchstart', touchStart,false);     

             document.getElementById("outer").addEventListener('touchmove', touchMove,false);     

             document.getElementById("outer").addEventListener('touchend', touchEnd,false);     

    </script>  

</body>  

</html>  
 

上面是demo的完整代码，这次使用的jquery，因为用到了animate 可以让滑动到最上面和最下面有点弹性

下面是demo效果，你也可以将代码copy用手机访问看看，代码比较简陋只是实现了效果还没有考虑到兼容性和健壮性

（编辑：焦作站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!