zoukankan      html  css  js  c++  java
  • js实现移动端悬浮图标拖拽

    /**
     * Created by Administrator on 2019/5/23.
     */
    window.onload = function () {
        var oDiv = document.getElementById('touchMove');
    
        var disX, moveX, L, T, starX, starY, starXEnd, starYEnd;
    
        oDiv.addEventListener('touchstart', function (e) {
            //e.preventDefault();
    
            disX = e.touches[0].clientX - this.offsetLeft;
            disY = e.touches[0].clientY - this.offsetTop;
            starX = e.touches[0].clientX;
            starY = e.touches[0].clientY;
        });
        oDiv.addEventListener('touchmove', function (e) {
            L = e.touches[0].clientX - disX;
            T = e.touches[0].clientY - disY;
            starXEnd = e.touches[0].clientX - starX;
            starYEnd = e.touches[0].clientY - starY;
            //console.log(L);
            if (L < 0) {
                L = 0;
            } else if (L > document.documentElement.clientWidth - this.offsetWidth) {
                L = document.documentElement.clientWidth - this.offsetWidth;
            }
    
            if (T < 0) {
                T = 0;
            } else if (T > document.documentElement.clientHeight - this.offsetHeight) {
                T = document.documentElement.clientHeight - this.offsetHeight;
            }
            moveX = L + 'px';
            moveY = T + 'px';
            //console.log(moveX);
            this.style.left = moveX;
            this.style.top = moveY;
        });
        window.addEventListener('touchend', function (e) {
            //alert(parseInt(moveX))
            //判断滑动方向
    
        });
    }
     
  • 相关阅读:
    最大后验估计(MAP)
    mysql启动问题access denied for user 'root'@'localhost'(using password:YES)
    Median of Two Sorted Arrays-----LeetCode
    Two Sum-----LeetCode
    动态资源不缓存 filter
    过滤器 filter
    分页
    aop动态代理 事务 threadlocal
    ThreadLocal 开启事务
    数据库 元数据
  • 原文地址:https://www.cnblogs.com/yehx/p/10913140.html
Copyright © 2011-2022 走看看