addeventlistener监听scroll跟touch

这三个事件只在手机上生效

touchstart,手指开始触屏

touchmove,手指移动

touchend,手指触屏结束

这个事件在手机上跟在pc端都生效

scroll事件

addeventlistener(name,callback,optional,useCapture)

useCapture：事件是否用捕获事件，从外到里，true

默认为false:使用冒泡事件，从里到外

optional:{

passive:false时，阻止默认事件，ture时不阻止默认事件(默认值是false)

}

passive:true可以防止页面滚动的时候，页面卡顿，但是奇怪的时，我没有设置的时候为什么页面看不出卡顿啊忧桑

大家有碰到过手机页面滚动的时候卡顿的情况吗，为什么我在手机上测试好像看花了眼一样

时间： 2024-10-08 12:50:10

addeventlistener监听scroll跟touch的相关文章

vue监听滚动事件，实现滚动监听(scroll滚动)

在vue中实现滚动监听和原生js无太大差异,下面是一个简单的demo,可在控制台查看结果 1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>Document</title> 7 <script type="text/javascript" src="

addEventlistener监听的事件完成一次后自动取消与jquery的one方法比较；animate动画制作，arguments.callee的用法

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum

vue 创建监听,和销毁监听(addEventListener, removeEventListener)

最近在做一个有关监听scroll的功能, 发现我添加监听之后一直不起作用: 1 2 mounted() { window.addEventListener("scroll", this.setHeadPosition); //this.setHeadPosition方法名 1 后来发现要在后面添加一个true之后才行: 1 2 3 mounted() { window.addEventListener("scroll", this.setHeadPosi

html学习 - javascript事件监听以及addEventListener参数分析

事件监听在Javascript中事件的监听是用来对某些操作做出反应的方法.例如监听一个按钮的pressdown, 或者获取鼠标左键按下时候鼠标的位置.这些都需要使用监听来完成.监听的函数很简单:addEventListener. 这里解释一下一个网页的嵌套关系:最外层:window 包含:document 包含:html 包含: body 包含:div等等... addEventListener监听方法按钮监听事件响应首先我们需要获取一个按钮的handle,获取的方法很简单,代码如下: v

vue监听滚动事件实现动态锚点

前几天做项目的时候,需要实现一个动态锚点的效果如果是传统项目,这个效果就非常简单.但是放到 Vue 中,就有两大难题: 1. 在没有 jQuery 的 animate() 方法的情况下,如何实现平滑滚动? 2. 如何监听页面滚动事件? 在浏览了大量文章.进行多次尝试之后,终于解决了这些问题期间主要涉及到了 setTimeout 的递归用法,和 Vue 生命周期中的 mounted 一.锚点实现在实现平滑滚动之前,得先确保基本的锚点功能如果没有其他要求,直接用 <a href="#i

js事件监听器用法实例详解-注册与注销监听封装

本文实例讲述了js事件监听器用法.分享给大家供大家参考.具体分析如下: 1.当同一个对象使用.onclick的写法触发多个方法的时候,后一个方法会把前一个方法覆盖掉,也就是说,在对象的onclick事件发生时,只会执行最后绑定的方法.而用事件监听则不会有覆盖的现象,每个绑定的事件都会被执行.如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 window.onload = function(){ var btn = document.getElementById("yuanEv

简单的监听事件

添加一个简单的监听器下面这个例子用来展示如何使用 addEventListener() 监听鼠标点击一个元素. <table id="outside"> <tr><td id="tt">one</td></tr> <tr><td id="th">two</td></tr> </table> // 改变t2的函数 functio

监听div的resize

简单点说,就是: 在被监听的 div 中添加 iframe 标签,设置其高宽均为 100%: 在 iframe 的 resize 被触发时,则表明 div 的大小正在改变! 参考 Resize on div element 来源于stackoverflow 的回答历程日常开发中,遇到元素宽高改变时需要广播事件,由于此时窗口大小并未改变,故添加resize回调没用:而且该元素是因为某些dom隐藏,其高宽自适应所导致,而不是通过js设置,故 MutationObserver 也无法监听到.上网找

事件监听addEventListener()和removeEventListener() ---------1

一直想写一个原生事件监听的记录,方便以后看,不愿意写主要是事件监听的单词太长,记起来好难记每次都要查,这次把知道的写完了,来这里查好了,以后要是理解的更透彻了,就再补全好了首先,DOM0级事件和DOM2级事件给一个元素添加事件有三种方法 HTML <input type="button" value='button1' id='btn1' /><input type="button" value='button2' id='btn2' />