[英]how to detect drag left to right with movement constrain?
我想檢測靜態(無運動)元素上的拖動事件的方向。 根據我的搜索,他們使用jquery-ui draggable
元素將移動。
這是我的嘗試(我使用containment
阻止其移動,但隨后我無法檢測到拖動方向)
var prevX = -1; $('div').draggable({ containment: "parent", drag: function(e) { //console.log(e.pageX); if (prevX == -1) { prevX = e.pageX; return false; } // dragged left if (prevX > e.pageX) { alert('dragged left'); } else if (prevX < e.pageX) { // dragged right alert('dragged right'); } prevX = e.pageX; } });
.wrapper { width: 100px; height: 100px; } .inside { width: 100px; height: 100px; background-color: yellow; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> <div class="wrapper"> <div class="inside"></div> </div>
使用dragstart
保存開始位置XY,使用end dragend
比較
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.