zoukankan      html  css  js  c++  java
  • html5滑动手势

      <div id="divMove" style="height: 100px;"></div>
        <div id="slideDiv" style=" 300px; height:30px;background-color:#AA967D;">
            左滑
            <button id="btnDelete" style="display: none;">删除</button>
        </div>
    <script type="text/javascript">
            var touchGlobal;
            document.getElementById("slideDiv").addEventListener("touchstart",function(e){
                touchGlobal=e.touches[0];    
                
            },false);
            document.getElementById("slideDiv").addEventListener("touchmove",function(e){
                var touch=e.touches[0];
                var x=Number(touch.pageX);
                document.getElementById("divMove").innerHTML=x;
                if(touchGlobal.pageX-x>0){
                    document.getElementById("btnDelete").setAttribute("style","display: inline");
                }
                else{
                    document.getElementById("btnDelete").setAttribute("style","display: none");
                }
            },false);
            document.getElementById("slideDiv").addEventListener("touchend",function(e){            
            },false);
        </script>
  • 相关阅读:
    梯度消失和梯度爆炸
    BN的作用与使用过程
    百面机器学习笔记(二)
    正则表达式
    CSS Sprite
    事件绑定
    拖拽
    oncontextmenu
    鼠标跟随
    鼠标事件
  • 原文地址:https://www.cnblogs.com/bygrace/p/4446579.html
Copyright © 2011-2022 走看看