css如何在页面内出现滚动条的地方禁止鼠标滑轮滚动

html-css05

css如何在页面内出现滚动条的地方禁止鼠标滑轮滚动,第1张

css只是层叠样式表,是控制页面的样式的,并不能对一些操作进行控制。至于禁止鼠标滑轮的滚动是需要用js控制的,在js中有一个mousewheel事件,对这个事件进行设置,可以实现对鼠标滚轮的一些操作。

css部分

.parent{

position:relative

height:100%//高度根据需求自行设定

}

.child{

position:absolute

left:0

top:0

right:0

bottom:0 //left,top,right,bottom都为0,充满真个页面

overflow-y:auto

overflow-x:hidden//设置Y轴出现滚动条,X轴隐藏

}

html部分

<div class="parent">

<div class="child"></div>

</div>

---------------------

作者:Franklin_hemm_2012

来源:CSDN

原文:https://blog.csdn.net/franklin_hemm_2012/article/details/78640753

版权声明:本文为博主原创文章,转载请附上博文链接!

一般我们默认的我们鼠标滑轮滑动一次就是向下或者向上滑动一行,但这样有的时候不能满足我们的需求,看一篇文章如果看完一屏幕再向下滑,通过滑轮的话就需要滑很久,如果我们设置一下鼠标滑轮每次滑动向下滑动几行或者是一页,那就方便多了,接下来我来演示一下如何操作设置。

操作方法

01

首先在桌面任意位置,用鼠标右击,在出来的菜单中选择个性化。接下来就会蹦出来一个电脑个性化设置的一个对话框。

02

在个性化设置对话框左侧可以找到一个更改鼠标指针的选项,我们点击选择它,就可以进入到鼠标属性的相关设置页面。

03

在鼠标属性设置对话框,上面就有一个滑轮选项,我们点击选择它,就可以进入到滑轮的设置相关页面。

04

我们可以看到滑轮的设置有垂直滚动和水平滚动,一般我们使用电脑的浏览页面的话都是说的垂直滚动。

05

在垂直滚动下就可以看到鼠标滑轮滚动一下可以向下移动多少进行具体的设置,可以是几行,在这里可以使用后面的那个小箭头来鼠标点击增加或者是减少,也可以是直接在编辑框内直接输入行数。

06

或者是设置为鼠标滑轮滚动一次就是一个屏幕,这样在看文章的时候会更加方便,不用总是在滑动屏幕,而且对眼睛也比较好。可以看到鼠标垂直滑动第二个选项就是一次滑动一个屏幕的选项,我们点击选择它,最后确定就可以了。