zoukankan      html  css  js  c++  java
  • js按钮浮动随手指方向移动而移动

        window.document.getElementById("moveDIV").addEventListener("touchmove", function (event) {
                
                event.preventDefault();
                
                if (event.targetTouches.length == 1) {
                    var touch = event.targetTouches[0];  // 把元素放在手指所在的位置
                 
                    if(touch.pageX + $("#moveDIV").width() > $(window).innerWidth()){
                        
                         window.document.getElementById("moveDIV").style.left = ($(window).innerWidth() - $("#moveDIV").width()) + 'px';
                        
                    }else if(touch.pageX < $("#moveDIV").width()){
                        
                        window.document.getElementById("moveDIV").style.left = 0 + 'px';
                        
                    }else{
                        
                        window.document.getElementById("moveDIV").style.left = touch.pageX + 'px';
                    }
                    
                   if(touch.pageY + $("#moveDIV").height() > $(window).innerHeight()){
                       
                           window.document.getElementById("moveDIV").style.top = ($(window).innerHeight() - $("#moveDIV").height())+ 'px';
                           
                   }else if(touch.pageY < $("#moveDIV").height()){
                        
                        window.document.getElementById("moveDIV").style.top = 0 + 'px';
                        
                    }else {
                       
                           window.document.getElementById("moveDIV").style.top = touch.pageY + 'px';
                           
                   }
                }
            },false)

  • 相关阅读:
    简单构建一个xmlhttp对象池合理创建和使用xmlhttp对象
    iBATIS.net获取运行时sql语句
    不做自了汉,大家好才是真的好
    sql查询,nolock写还是不写,这是一个问题
    Sublime Text 2 快捷键用法大全(转)
    javascript设计模式入门之策略模式
    记一次外单前端页面编写小结
    代码驾驭
    一次项目总结,内容设置页面
    【百度地图API】今日小年大进步,齐头共进贺佳节——API优化升级上线,不再增加内存消耗
  • 原文地址:https://www.cnblogs.com/myRain/p/6046892.html
Copyright © 2011-2022 走看看