Js判断H5上下滑动方向及滑动到顶部和底部判断-优快云博客

本文介绍如何在H5移动端开发中实时判断滑动方向，以及检测是否滑动到底部或顶部。通过整合不同资源，提供了一个实用的小例子，适用于触发特定事件。请注意，若在PC浏览器中查看，请切换到手机模式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

昨天一位做移动端H5开发的同事说，H5滑动方向要实时判断向下还是向上，但判断是否滑动到底部时判断有问题一直没解决，于是就去问度娘，搜了很多资料，大部分有重复，于是根据大家的资料借鉴学习，在大家的基础上写了一个小例子。功能主要时可以实时的判断上下滑动的方向，是否滑动到底部或顶部来做某些事件触发。例子中有使用到其他博客上的内容，如原作者看到请勿怪，如果例子中有错误的请大家指正。如果使用pc端浏览器查看请把浏览器设置为手机浏览器模式。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>手机端触屏手指滑动方向</title>
<meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,user-scalable=no,maximum-scale=1.0" id="viewport" name="viewport">
<script type="text/javascript">
var touch_screen = {
　　 //方向
    direction: {
	currntY: 0,
	lastY: 0,
	direction: "no",

	start: function() {
            var self = this,
                obj = self._object;
            obj.addEventListener('touchstart', function(e) {               
                self.move();
            }, false);
            obj.addEventListener('touchend', function(e) {
		self.move();
		lastY = document.body.scrollTop;
            }, false);
        },
      &nbs