js 滚轮向上事件_js滚轮向上向下滚_滚轮事件 js - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Fabric.js 缩放画布 🍬

getZoom 可以获取画布当前缩放级别，用 setZoom 设置一个新的缩放级别。

03

随心所欲的滚动条，远离产品汪（二）

还记得上周咱们说的“随心所欲滚动条，远离产品汪”一文吗？当中介绍了自定义滚动条的基本原理与实现方法，在自定义滚动条实现后，可以通过对滚动条的上下拖动来控制内容区的显示，使用过的朋友会发现，如果对篇幅较长的内容来说，不停的拖动滚动条来查看内容，还是比较麻烦的，于是本文在上篇代码的基础上添加了滚轮事件并处理了相应的兼容问题。本文内容 1、原理结构图 2、滚轮事件及兼容问题概要 3、具体实现步骤 4、小结原理结构图为了方便大家熟悉理解，希望大家能够回顾下上篇“随心所欲滚动条，远离产品汪（一）”，本文继续使用

08

您找到你想要的搜索结果了吗？

是的

没有找到

接上一篇事件详解

事件类型： DOM3级事件规定了以下几类事件；如下： UI事件：当用户与页面上的元素交互时触发； load事件：当页面加载完后(包括所有图像，所有javascript文件，css文件等外部资源)，就会触发window上面的load事件，如下代码是加载图片的： HTML代码： JS代码如下： var img = document.getElementById("img"); EventUtil.addHandler(img,'load',fu

06

Vue 实现图片监听鼠标滑轮滚动实现图片缩小放大功能

其实想要实现功能很简单，就是在一张图片上监听鼠标滑轮滚动的事件，然后根据上滚还是下滚实现图片的缩放。

02

图形编辑器基于Paper.js教程09：鼠标拖动画布，以鼠标点为缩放中心进行视图的缩放

在Web开发中，利用Paper.js库进行图形的绘制和交互操作是一种常见的实践。Paper.js是一个强大的矢量图形库，可以让开发者通过简洁的API完成复杂的图形操作。在本文中，我们将详细探讨如何使用Paper.js来实现对画布的缩放和拖动功能，提供用户友好的交互体验。（作者：CSDN@拿我格子衫来）

01

jquery 滚轮插件 jquery.mousewheel.js

jquery中没有鼠标滚轮事件，那么可以使用jquery的滚轮事件插件jquery.mousewheel.js。

02

Fabric.js 锁定背景图，不受缩放和拖拽的影响🎃

如果你的项目有画布拖拽、缩放等功能，而且你不希望背景图跟随拖拽或缩放，那一定要往下读。

02

[WPF自定义控件库] 关于ScrollViewr和滚动轮劫持(scroll-wheel-hijack)

所有代码就这么多，这个ExtendedScrollViewer 只是用来解决滚动轮劫持(scroll-wheel-hijack)的问题。所谓的滚动轮劫持，简单来说即是在一个可以滚动的页面使用鼠标滚轮滚动页面的过程中鼠标进入某个可以滚动的子元素导致只在这个子元素中滚动而整个页面想滚滚不动了。

03

【Java AWT 图形界面编程】使用鼠标滚轮放大缩小 Canvas 画布 ( 鼠标滚轮事件监听器 MouseWheelListener )

设置鼠标滚轮监听 , 在 Canvas 组件中 , 调用 addMouseWheelListener 函数 , 添加鼠标滚轮监听器 MouseWheelListener ,

03

jimojianghu

有天，辛苦做了个复杂操作功能的页面，上线后有用户反馈：很多功能使用不了。惊了，以为是哪里出了bug。立马联系用户，才发现原来是用户使用笔记本电脑，没有禁用触控板，然后不小心碰到导致整个界面都放大，很多功能超出界面不见了。然而那能怎么办，用户第一，自然得快速解决这个问题，而且是触控板和触摸屏都得解决。

00

VUE2.0 学习（一）HTML单页面使用vue技术

html 页面引入vue.js 之后，全局配置一下，将浏览器控制台的开发者版本的提示给关闭

02

JavaScript（进阶）

正则用来定义一些字符串的规则，程序可以根据这些规则来判断一个字符串是否符合规则，也可以将一个字符串中符合规则的内容提取出来。

02

实现pc端鼠标滚轮缩放图片的步骤

之前写一个图片预览插件的时候，遇到了鼠标滚轮滚动进行图片缩放的需求，现在来回顾一下。

03

js常用事件整理—兼容所有浏览器

1.鼠标滚动事件。说明：返回值大于0向上滚动，小于0向下滚动。兼容型：所有浏览器。代码： /*********************** * 函数：鼠标滚动方向 * 参数：event * 返回：滚轮方向[向上（大于0）、向下（小于0）] *************************/ var scrollFunc = function(e) { var direct = 0; e = e || window.event; if (e.wheelDelta) {//

09

Fabric.js 拖放元素进画布

上面的代码使用了 Fabric.js 绑定了页面上的画布，并创造了一个粉红色的矩形。

03

jquery 滚轮插件示例 - 整屏滚动

要做出这个效果，其实不用说，首先要把这五个div的基本HTML+CSS给写出来先。

02

JavaScript基础

使用addEventListener()可以同时为一个元素的相同事件同时绑定多个响应函数，这样当事件被触发时，响应函数将会按照函数的绑定顺序执行这个方法不支持IE8及以下的浏览器

02

js - 移动端的超出滚动功能，附带滚动条，可解决弹层中滚动穿透问题。

1、解决滚动穿透：通过给弹层绑定touchmove和mousewheel事件，取消默认行为实现。

01

js监听滚轮事件

chrome（ie）与firefox对滚轮事件的监听方式是不一样的,并且返回的数值正负也是正好相反的

01

打造聊天框丝滑滚动体验：AI 聊天框的翻转之道

最近在开发AI聊天助手的时候，遇到了一个很有趣的滚动问题。我们需要开发一个类似微信聊天框的交互体验：

02

JavaScript学习笔记024-默认行为0滚轮事件

Author：Mr.柳上原付出不亚于任何的努力愿我们所有的努力，都不会被生活辜负不忘初心，方得始终想要进入前端圈子里工作原来需要懂得太多太多刚开始学习前端好高骛远以为html+css很牛逼了然后学了js以为自己已经是前端了到处投简历说自己精通原生js 不会任何框架现在想来还是太年轻学了node+mongodb+pug+layui 学了vue 却发现要成为一个真正的前端工程师，这些远远不够还需要git 还需要less，sass 还需要小程序还需要Bootstrap 还需要Rea

02

Vue&uni-app swiper 轮播支持鼠标滚轮翻页实现

最近使用 uni-app 开发的一个 H5 项目，其中有一个用 uni-app 原生 swiper 组件写的轮播。

03

Vue&uni-app swiper 轮播支持鼠标滚轮实现

最近使用 uni-app 开发的一个 H5 项目，其中有一个用 uni-app 原生 swiper 组件写的轮播。

04

Vue&uni-app swiper 轮播支持鼠标滚轮实现

最近使用 uni-app 开发的一个 H5 项目，其中有一个用 uni-app 原生 swiper 组件写的轮播。

02

Vue&uni-app swiper 轮播支持鼠标滚轮翻页实现

最近使用 uni-app 开发的一个 H5 项目，其中有一个用 uni-app 原生 swiper 组件写的轮播。

03

问题探讨01：如何使用鼠标滚轮使单元格中的数值增减？

问题：前不久，有个网友给我提了个问题要我帮助解决。这个问题是，在某单元格中有一个数字，当鼠标滚轮向上滚动时该单元格中的数字以0.01的间隔增加，向下滚动时以0.01的间隔减少？

01

JS事件篇

浏览器加载一个页面时，是按照自上而下的顺序加载的，读取到一行就运行一行，如果将script标签写到页面上边，在代码执行的时候，页面还没有完全加载

01

Echarts数据可视化全解注释

github地址：https://github.com/626626cdllp/echarts

04

如何使用jQuery操作浏览器窗口事件？【jQuery框架应用入门15】

本文主要针对浏览器的窗口事件做一些简要介绍，只在让读者可以入门操作bom有关的事件。

01

后台管理tab栏滑动解决方案

后台管理系统中比较常见的布局是左边菜单栏，右边tab切换栏，但是一般的tab组件不包含tab页过多的切换问题的，所以需要个性化实现，本文的实现方案是滑动鼠标滚轮绑定tab达到切换的效果，先上一个动态图看下效果

03

jQuery 之元素节点操作滚轮事件与函数节流

元素节点操作创建节点 var $div = $('

'); var $div2 = $('

这是一个div元素

'); 插入节点 1、append()和appendTo()：在现存元素的内部，从后面插入元素 var $span = $('这是一个span元素'); $('#div1').append($span); ......

2、prepend()和prependTo()：在现存元素的内部，从前面插入元素

06

js事件浏览器兼容案例

var EventUtil = { //返回对event对象的引用 getEvent: function (event) { return event ? event

02

前端学习(53)~键盘事件

onmousewheel：鼠标滚轮滚动的事件，会在滚轮滚动时触发。但是火狐不支持该属性。

02

【Java AWT 图形界面编程】使用小键盘按键缩放 Canvas 画布中绘制的背景图像 ( 键盘按键监听 + 绘制超大图像 + 鼠标拖动 + 鼠标滚轮缩放 + 以当前鼠标指针位置为缩放中心示例 )

如果要为 Java AWT 界面编程的应用设置键盘按键监听 , 必须为 Frame / JFrame 窗口设置键盘监听 , 为组件设置是无效的 ;

02

鼠标滚轮事件介绍

简介　　IE6实现了鼠标滚轮事件mousewheel，这个事件包含了一个鼠标事件所没有的属性，wheelDelta，这个属性值始终是120的倍数，而且向上滑动一单位，wheelDelta值为120，向下为-120.随后Chrome，Opera， Safari等也都实现了该事件。Opera10之前的版本对wheelDelta值的符号处理错误，需要修改。但是Firefox没有该事件，而是用DOMMouseScroll。这个事件只有Firefox支持，所以可以单独针对Firefox做兼容。　　另外，HTM

06

这一次，彻底解决滚动穿透

本文由 IMWeb 团队成员 erasermeng 首发于腾讯内部KM论坛。点击阅读原文查看 IMWeb 社区更多精彩文章。什么是滚动穿透如图所示，有一层遮罩蒙层覆盖在body上时，当我们滚动遮罩层，它下面的内容也会跟着一起滚动，看起来好像是上面的滚动事件穿透到下面的DOM元素上一样，我们称之为滚动穿透。阻止冒泡？刚开始遇到这个问题的同学可能会联想到是不是由于事件冒泡到body上引起的，于是监听 scroll/touchmove事件，阻止事件冒泡。事实上，这并没有什么卵用。首先，一般而言滚动

02

ArcGIS JS API 4.16控制地图的缩放大小

在3.X的ArcGIS JS API版本中我们可以轻松的调用相应的API来实现地图的缩放大小的控制，让实例化后的地图在我们设置的范围中进行缩放，但是在4.X的版本中并没有相应的属性来控制，所以我们采用一种折中的方式来实现。

01

Fabric.js 居中元素 🎗️

阅读本文需要你有一定的 Fabric.js 基础，如果还不太了解 Fabric.js 是什么，可以阅读《Fabric.js 从入门到膨胀》

02

从零开始学 Web 之移动Web（五）touch事件的缺陷，移动端常用插件

我们在上面《页面分类》的项目中，对 tap 事件的处理使用的是 touch 事件处理的，因为如果使用 click 事件的话，总会有延时。

02

OpenGl 实现鼠标分别移动多个物体

原文链接：https://www.cnblogs.com/DOMLX/p/11620088.html

02

JS 滚轮事件实现固定在窗口某个位置的元素显现或隐藏

效果图 html代码

</box> css代码 html,body{ height: 1000px; } #box{ width: 100%; height: 200px; background-color: red; position: fixed; bottom: 0; display: none; } JavaScript代码 //获取元素 var box = document.getElementById('box'); //判断是否为火狐浏览

01

面试官：哪些浏览器事件不会冒泡？

回答这个问题之前，我们首先要具备DOM事件流捕获与冒泡的知识，这里只讲JS中如何设置这两种事件监听，例如对body注册点击事件：

02

C++ Qt开发：Charts折线图绑定事件

Qt 是一个跨平台C++图形界面开发库，利用Qt可以快速开发跨平台窗体应用程序，在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置，实现图形化开发极大的方便了开发效率，本章将重点介绍QCharts折线图的常用方法及灵活运用。

01

学习滚动插件iScroll的简单使用

iScroll是一个高性能，资源占用少，无依赖，跨平台的javascript上拉加载，下拉刷新的滚动插件，目前版本v5.2.0。

03

浅谈JavaScript的事件（事件类型）

Web浏览器能够发生的事件有很多种类型，不同的事件类型有不同的事件信息。DOM3级的事件类型主要包括：UI事件，用户与页面上的元素交互时触发；焦点事件，元素获得或失去焦点触发；鼠标事件，用户通过鼠标在页面上执行操作时触发；滚轮事件，使用鼠标滚轮时触发；文本事件，当在文档中输入文本时触发；键盘事件，用户通过键盘在页面上操作触发；合成事件，当为IME输入字符时触发；变动事件，底层DOM结构发生变化时触发。 UI事件　　UI事件的触发并不一定是由用户操作触发的，包括：load，页面完全加载后在window上

05

【Java AWT 图形界面编程】使用鼠标滚轮缩放 Canvas 画布中绘制的背景图像 ( 绘制超大图像 + 鼠标拖动 + 鼠标滚轮缩放 + 以当前鼠标指针位置为缩放中心示例 )

鼠标指针指向界面中的 Canvas 画布某个位置 , Canvas 画布中绘制着一张超大图片 , 以该位置为中心 , 滑动鼠标滚轮时进行缩放 ;

01

UE 实现镜头平移，旋转和缩放

在数字孪生三维场景中，通过键盘和鼠标来控制镜头的移动，缩放是很常见的行为，也是很必要的行为，用户正是通过这些操作，达到对整个三维场景的观看和控制。

02

鼠标按键的获取

看到现在很多应用，包括做的很优秀的产品，很多居然是支持右键进行拖拽的，在页面有滚动条时，也不会随着鼠标移动的方向向上、向下去滚动滚动条。

03

《最新出炉》系列入门篇-Python+Playwright自动化测试-45-鼠标操作-下篇

鼠标为我们使用电脑提供了很多方便，我们看到的东西就可以将鼠标移动过去进行点击就可以打开或者访问内容，当页面内容过长时，我们也可以使用鼠标滚轮来实现对整个页面内容的查看，其实playwright也有鼠标操作的方法。上一篇文章中已经讲解过鼠标的部分操作了，今天宏哥在这里将剩下的其他操作进行一个详细地介绍和讲解。

02

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭