1、html中定义2个方法
onmousedown="mousedown()" onmouseup="mouseup()"
2、js滑动效果代码
var startX = 0; //全局变量, 记录鼠标按下的横坐标
// 按下鼠标
function mousedown(event) {
var e = window.event;
var obj = e.srcElement;
obj.style.color = 'blue';
startX = e.clientX;
}
// 抬起鼠标
function mouseup(event) {
var e = window.event;
var obj = e.srcElement;
obj.style.color = 'black';
var endX = e.clientX;
// 左滑
if((startX - endX)>70){
//上一篇文章
console.log('左:e: '+ endX + ', s: ' + startX)
}
// 右滑
if((endX - startX)>70){
//下一篇文章
console.log('右:e: '+ endX + ', s: ' + startX)
}
}
上面是“js实现滑动切换上一篇下一篇功能”的全面内容,想了解更多关于 js 内容,请继续关注web建站教程。
当前网址:https://ipkd.cn/webs_13506.html
猜你喜欢
声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

js如何利用sort对各种数组元素进行排序
Xiaomi-Robotics-0模型官网首页入口,小米开源的首代机器人VLA(视觉-语言-动作)大模型 










