我正在使用 jquery 开发一个移动应用程序,需要用户能够触摸并按住一个 div,然后滑到另一个 div。我不知道如何让第二个 div 注册触摸现在在它上面。
因此,例如,当某人触摸并按住 div 4,然后滑入 div 1、3、5 或 7 时,我希望能够知道他们滑入了哪个 div 并更改该 div 的内容。
这是我到目前为止的一些 fiddle : https://jsfiddle.net/hedonicmania/wuqa7a9y/4/
这是我到目前为止的代码:
html:
<div class="game-container">
<div class="game-square" id="0" ></div>
<div class="game-square" id="1" ></div>
<div class="game-square" id="2" ></div>
<div class="game-square" id="3" ></div>
<div class="game-square" id="4" ></div>
<div class="game-square" id="5" ></div>
<div class="game-square" id="6" ></div>
<div class="game-square" id="7" ></div>
<div class="game-square" id="8" ></div>
</div>
CSS:
.game-container {
width:300px;
height:300px;
}
.game-square {
width:100px;
height:100px;
float:left;
/* inside border */
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
border: 1px solid #222;
position: relative;
}
js:
var divs = $('.game-square');
$('.game-square').bind('touchstart', function(){
var thisDiv = document.getElementById($(this).attr('id'));
thisDiv.style.backgroundColor = '#FFB395';
});
$('.game-square').bind('touchend', function(){
var thisDiv = document.getElementById($(this).attr('id'));
thisDiv.style.backgroundColor = '#ADE8AF';
});
感谢您的帮助。
最佳答案
您可以通过使用 flag on 检查用户是否正在滑动 game-square
来做到这一点。您可以在 JSFiddle 上看到实现
关于javascript - 如何知道触摸何时从一个 div 滑到另一个?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37914343/