Javascript 通过触摸拖动div-非常慢

我在试着做一个拖拉的潜水

Javascript代码片段：

document.getElementById('mySidenav').addEventListener('touchmove',
   function(event) {
       event.preventDefault();

       clickX = event.touches[event.touches[0].identifier].pageX;

       if(navigationOpen){          
        //draggable.style.width = Math.floor(clickX) + 'px';
        document.getElementById('mySidenav').setAttribute("style","width:"+ clickX + "px");
    }

}, false);

现在有两个问题：

1） 直到我停止移动，拖动才起作用（不一定是结束触摸）

2） 当

移动时，也有一点滞后

我通过输出我的

clickX

来查看移动，它在30fps下工作正常

我做错什么了吗？有办法做到这一点吗

更新：

---

我在Android上的Cordova中运行这个程序

您没有粘贴HTML，所以这里只是一个可拖动div的快速示例，它在触摸设备上运行得非常好

var nodeList=document.getElementsByClassName（'dragme'）；
对于（变量i=0；i

.dragme{
宽度：50px；
高度：50px；
位置：绝对位置；
背景颜色：灰色；
边框：2件纯黑；
}

---

您没有粘贴HTML，因此这里只是一个可拖动div的快速示例，它在触摸设备上运行得非常好

var nodeList=document.getElementsByClassName（'dragme'）；
对于（变量i=0；i

.dragme{
宽度：50px；
高度：50px；
位置：绝对位置；
背景颜色：灰色；
边框：2件纯黑；
}

---

谢谢你们的帮助。出于某种原因，解决方案是从CSS中删除代码

.sideNav {
    ...
    ...

    transition: 0.5s; /* This */
}

---

但是现在sideNav关闭/打开时没有流畅的动画：（

谢谢大家的帮助。出于某种原因，解决方案是从CSS中删除代码

.sideNav {
    ...
    ...

    transition: 0.5s; /* This */
}

---

但是现在sideNav关闭/打开时没有流畅的动画：（

你不使用jQuery？或者具体地说是jQuery Mobile？我还在学习：）你不使用jQuery？或者具体地说是jQuery Mobile？我还在学习：）谢谢你的详细帮助，我已经设法让它工作了，也许你可以帮我解决其他问题？：）当然可以，请走开！我最迟在星期一再看你的另一个问题：）谢谢你的详细帮助，我确实成功了，也许你可以帮助解决其他问题？：）当然可以，请走开！我最迟在星期一再看你的另一个问题：）