鼠标滚轮无法滚动翻页

鼠标滚动上下翻页效果是一种常见的网页交互设计，它使得用户可以通过鼠标滚轮的滚动来实现页面的上下翻页操作。这种效果通常应用于多图片、或长页面分页浏览的情况，使得用户可以方便地快速浏览内容，提高用户的交互体验。

今天作者就教大家如何在Axure中制作一鼠标滚动上下翻页的效果，我们会以鼠标滚动切换图片为案例。

一、效果展示

鼠标向上滚动时，切换查看上一张图片；

鼠标向下滚动时，切换查看下一张图片；

循环效果，如果在最后一张图片继续向下滚动，就会循环至第一张图片；如果在第一张图片继续向上滚动，就会循环值最后一张图片。

二、制作教程

这个模板我们主要用到中继器、图片元件、文本标签、矩形来制作。

1）图片的动态面板

我们先导入一张图片，导入后鼠标右键将图片转为动态面板，然后复制动态面板的状态，有几张图片就复制几个状态，在每个状态里一次打入对应的图片，这样图片的动态面板就完成了。

2）鼠标滚动的动态面板

因为我们要实现鼠标滚动的交互，一般的元件没有鼠标向上滚动和向下滚动的交互，所以我们要用动态面板来制作，只有动态面板有这个交互。

我们在动态面板里增加一个矩形，填充颜色为透明色，这样就不会遮挡与图片了。因为我们要做滚动的效果，所以动态面板里面的元件尺寸，一定要比动态面板高，这样才会出现滚动条。所以我们把矩形的尺寸设置为19998，2万是axure的极限，反正就是拉到最长，这样可以让他有足够的滚动空间。

动态面板调出滚动条，高度和图片一致，这里会默认看到滚动条，案例中的滚动条是默认隐藏的，所以我们需要用一个特殊的操作来隐藏，我们把动态面板宽拉大，直到滚动条在图片右侧，然后我们再次将动态面板转为动态面板，这样就多了一个外面板，外面板选择不显示滚动条，宽高和图片设置为一样，放在图片动态面板上方。这要就即可以有滚动效果，但是又不出现滚动条。

1）向下滚动的交互

鼠标向下滚动时，按理来说，我们只需用设置面板状态的交互，就能将图片设置到下一个页面。

但是我们在这中间遇到了问题，这样写了之后会发现，鼠标向下滚动，会有很多张图片切换，整个页面很乱。这里面的原因是因为鼠标向下滚动是一个持续值，有些人滚动一下可能持续0.1秒，有些人滚动一下可能1秒，就是没有办法一瞬间完成这个操作，导致这途中触发了多次事件。

为了解决这个问题，我们就要做一个开关来控制，我们用个隐藏的文本标签就可以了，默认值为0，如果值为0的时候，就是可以滚动切换的状态，一开始切换的时候，我们就要把开关的值设为1，然后在用设置面板状态的交互，设置到","gnid":"9cd0f7ffcb455c549","img_data":[{"flag":2,"img":[{"desc":"","height":"420","title":"","url":"https://p0.ssl.img.360kuai.com/t01157e71a353a302d2.jpg","width":"900"},{"desc":"","height":"210","s_url":"https://p0.ssl.img.360kuai.com/t01c55ff181cae76efa_1.gif","title":"","url":"https://p0.ssl.img.360kuai.com/t01c55ff181cae76efa.gif","width":"426"},{"desc":"","height":"420","title":"","url":"https://p0.ssl.img.360kuai.com/t011fef7f24c1e4ff9a.jpg","width":"806"}]}],"original":0,"pat":"art_src_3,fts0,sts0","powerby":"cache","pub_time":1680175320000,"pure":"","rawurl":"http://zm.news.so.com/92b4f8c546a6009a9972aa8795d4100a","redirect":0,"rptid":"a35462d471e60817","rss_ext":[],"s":"t","src":"人人都是产品经理","tag":[],"title":"Axure高保真教程：鼠标滚动上下翻页效果

后菊兔4546鼠标中键不能滚动网页了 怎么办? -
桓咸畅19119264609 ______ 1 排除接口的接触不良 由于鼠标是外置设备,接口接触不良最有可能导致鼠标失灵,遇到此类情况,可以固定一下鼠标的接口.如果鼠标脱离了电脑接口,可以先关闭电脑,插入鼠标,然后再开机使用. 2 清除灰尘鼠标失灵也可能会表现为发塞...

后菊兔4546网页不能用鼠标滚轮控制滚动条 我鼠标滚轮上下滚动..但网页没反应.这是怎么回事..怎么修复.. -
桓咸畅19119264609 ______ 控制面板-----Internet属性-----高级-----使用平滑滚动(不勾选)

后菊兔4546鼠标轮在网页里不能滚动页面是怎么回事啊? 在文件夹里也不可以. -
桓咸畅19119264609 ______ 也有可能 滚轮是坏的或假的.......我就遇到过.

后菊兔4546鼠标滚轮在浏览网页的时候不能滚动 -
桓咸畅19119264609 ______ 这是和其他某个软件有冲突,也就是说你安装的某个软件在按中键时对应一个操作,这样他就霸占了中键的功能了!

后菊兔4546鼠标滚轮怎么无法滚动浏览的网页页面 -
桓咸畅19119264609 ______ 你确定你的鼠标滑轮没有问题?? 这个应该跟系统没有关系. 如果还没解决你的问题,可以加我百度HI账号.

后菊兔4546鼠标滚轮不能滚动网页
桓咸畅19119264609 ______ 可以 需要用腾讯TT浏览器

后菊兔4546鼠标滚轮不能上翻页?
桓咸畅19119264609 ______ 和我的情况一样,滚轮坏了~~我修好2个是用95%的分析纯(也就是95%的乙醇)清洗滚轮后就正常了~~~可以通电清洗~~~(要拆开鼠标哦~~清洗滚轮的机械部件,微动就不用洗了~~~)

后菊兔4546鼠标的滑轮不能翻动网页了?
桓咸畅19119264609 ______ 你看看是不是在更新了什么之后才这样的,把那个更新的删掉.再看看....

后菊兔4546我的鼠标滑轮无法翻页,看网页的时候只有按中键才能上下滚动 -
桓咸畅19119264609 ______ 这个要在驱动里设置,像我的雷柏的V21,直接插上usb口,打开开关就能用!有的快捷键需要安装驱动后才能设置!

后菊兔4546鼠标滑轮不能上下滑动页面 -
桓咸畅19119264609 ______ 要滑动的时候你可以在网页空白处点击一下,在滑动看看,如果还是不行,鼠标就坏了