js的window.onscroll事件

js代码：
window.onscroll = function(e){var e =e || window.event;var scrolltop=document.documentElement.scrollTop||document.body.scrollTop;console.log(scrolltop);if(scrolltop>55){console.log(1)}}

css代码

html,
body {
   position: relative;
   width: 100%;
   height: auto;
}

html {
   margin: 0;
   overflow-y: scroll;
   overflow-x: hidden;
}

/*核心代码*/
html::-webkit-scrollbar {
   /*滚动条整体样式*/
   width: 4px;
   /*高宽分别对应横竖滚动条的尺寸*/
   height: 4px;
}

html::-webkit-scrollbar-thumb {
   /*滚动条里面小方块*/
   border-radius: 5px;
   -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
   background: rgba(0, 0, 0, 0.2);
}

html::-webkit-scrollbar-track {
   /*滚动条里面轨道*/
   -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
   border-radius: 0;
   background: rgba(0, 0, 0, 0.1);
}

（下边哪些是滚动条样式，可不用）

js的window.onscroll事件相关推荐

window.onscroll 事件不触发问题
要求:滚动鼠标时,触发滚动事件: 问题:滚动时,没有触发事件: html,body{overflow-x: hidden;font-size: 16px;color: #666;margin: 0 a ...
onscroll事件没有响应的原因以及vue.js中添加onscroll事件监听的方法(vue上监听scroll事件
在vue.js中直接使用onscroll不起作用利用DOM二级监听事件即可, window.addEventListener('scroll',()=>{console.log(window. ...
JS中window.onload事件详解
window.onload出现的原因? 我们都知道页面的代码顺序是从上往下进行加载,很多时候我们要对页面中的某一个模块进行操作,这时候我们常常使用javascript代码来进行操作.为了能够保证操作 ...
JS中window.event事件使用详解
一.描述 event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如:from ...
html scroll无效,window.onscroll无效问题
修改Spzac主题时发现侧边栏滚动固定不起作用了,看了一下Console也没输出,证明 window.onscroll 事件没有生效,排查了很久. 一开始以为JS代码拼错了,但是看了半天没有问题... ...
onscroll事件
window.onscroll事件 <script>window.onscroll = function () {var scrollTop = $(this).scrollTop();/ ...
JS 动态添加 onload、onresize、onscroll 事件
window 的 onload.onresize.onscroll 事件,跟其他的事件不一样,它不能用 attachEvent 或 addEventListener 来添加. 也就是说,它只能这样来( ...
关于IOS设备window onscroll滚动条滚动事件不触发的问题
http://blog.hooperui.com/%E5%85%B3%E4%BA%8Eios%E8%AE%BE%E5%A4%87window-onscroll%E6%BB%9A%E5%8A%A8%E6 ...
js onscroll android,JavaScript触发onScroll事件的函数节流详解
问题描述常见的网站布局,顶部一个导航栏,我们假设本页面共有四个栏目:分别为A.B.C.D,我们点击A,锚点跳转至A栏目,同时顶部的A按钮高亮:点击B,锚点跳转至B栏目,同时顶部的B按钮高亮:我们在M ...

js的window.onscroll事件

js的window.onscroll事件

js的window.onscroll事件相关推荐

最新文章

热门文章