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

前端领域优质创作者

2023-03-08 14:24:45

加精

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

https://blog.csdn.net/weixin_48998573/article/details/129400110?utm_source=bbs_include

...全文

成就一亿技术人!

331 2 打赏收藏转发到动态举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

我是夜阑的狗 2023-03-08

打赏
举报

回复

挺详细的

吃糖以后更甜 2023-03-08

打赏
举报

回复 1

第一

接着，在JavaScript中，我们可以监听鼠标的滚轮事件（`wheel`），并根据滚动的方向调整图片的大小。这里需要计算缩放比例，以保持图片的原始比例。以下是一个简单的示例： ```javascript document.getElementById('...

当用户滚动鼠标滚轮时，我们可以监听`mousewheel`事件来改变`fov`，并更新相机的投影矩阵（projection matrix）： ```javascript function mousewheel(e) { e.preventDefault(); if (e.wheelDelta) { // 浏览器...

其实想要实现功能很简单，就是在一张图片上监听鼠标滑轮滚动的事件，然后根据上滚还是下滚实现图片的缩放。其实就是这种效果：其实代码不是很难。@mousewheel.prevent 来监听鼠标滑轮滚动。没了，当鼠标在这个图片...

ES6列举常用的ES6特性：箭头函数需要注意哪些地方？let、const、var拓展：var方式定义的变量有什么样的bug？Set数据结构拓展：数组去重的方法箭头函数this的指向。手写ES6 class继承。开源分享：【大厂前端面试题...

214

社区成员

160

社区内容

发帖

与我相关

我的任务

vue.jsecmascript前端个人社区江苏省·苏州市

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章