-
赫本的猫2017-10-26 00:00
- 10
- 46
- 0
//温度滑动调节
$$("#btn").on("touchstart",function(e){
var btn = $$("#btn");
//记录起始位置
var startPos = e.targetTouches[0].pageX;
e.preventDefault();
if(e.targetTouches.length == 1){
btn.on("touchmove",move);
function move (e){
var touch=event.targetTouches[0];
var bar = $$("#bar");
var bar_left = bar.offset().left;
var min_left = touch.pageX - bar_left;
if(min_left<0){
min_left=0;
};
if(min_left>$$("#bar").width()){
min_left=$$("#bar").width();
};
btn.css("left",min_left+'px');
$$("#scaleprogress").css("width",min_left+'px');
};
btn.on("touchend",function(e){
//记录结束位置
var endPos = e.changedTouches[0].pageX;
//通过开始结束位置判断滑动方向
var moveX = endPos - startPos;
if(moveX>0){
console.log("go forword");
}else{
console.log("back forword")
}
});
};
},false);
已经写好了拖动的效果 但是因为拖动改变温度的时候 需要每次拖动移动的距离是1/（温度Max-温度Min）个bar的距离 这个要怎么确定
- 共 0 条
- 全部回答
-
ぐ花葬つ 普通会员 1楼
在JavaScript中，你可以使用
requestAnimationFrame函数来实现拖动的距离限制。以下是一个简单的示例：```javascript // 获取元素 var element = document.getElementById('myElement');
// 使用requestAnimationFrame来处理滚动事件 element.addEventListener('touchmove', function(event) { // 检查是否有拖动事件发生 if (event.touches.length > 1) { // 获取当前和上一个触摸点的距离 var currentDistance = Math.sqrt(Math.pow(event.touches[0].clientX - event.touches[1].clientX, 2) + Math.pow(event.touches[0].clientY - event.touches[1].clientY, 2)); var lastDistance = Math.sqrt(Math.pow(event.touches[0].clientX - event.touches[0].clientX, 2) + Math.pow(event.touches[0].clientY - event.touches[0].clientY, 2));
// 如果当前距离大于限制距离，阻止拖动 if (currentDistance > 10) { event.preventDefault(); } }}); ```
在这个示例中，我们首先获取了id为'myElement'的元素，然后使用
addEventListener函数添加了一个touchmove事件监听器。当用户开始拖动时，这个监听器会被触发。在touchmove事件处理函数中，我们检查是否有多个触摸点同时触碰到同一个元素。如果有，我们就获取当前和上一个触摸点的距离，然后判断这两个距离是否大于限制距离。如果是，我们就阻止用户继续拖动。请注意，这只是一个基本的示例，实际的拖动限制可能需要更复杂的逻辑，例如考虑滑动的限制、屏幕的大小、方向等等。
- 扫一扫访问手机版
回答动态
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题函数计算不同地域的是不能用内网吧？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题在ARMS如何申请加入公测呀？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的，这个init方法在哪里进行添加？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器刚到期，是不是就不能再导出存档了呢？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了，怎么办？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了，怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了，是什么情况？预计能赚取 0积分收益
- 回到顶部
- 回到顶部