有时在页面上,需要Fixed(css里的position属性)的效果,用JS实现的话,在如题的三个平台可以这样写:
window.onscroll = _onScroll;
function _onScroll(){
var labeller_layer = document.getElementById('labeller_layer');
var scrollTop = document.documentElement.scrollTop + document.body.scrollTop;
labeller_layer.style.top = scrollTop + 'px';
};
其中document.documentElement.scrollTop + document.body.scrollTop;就是处理兼容性的关键,当页面加入DTD标示后 document.documentElement.scrollTop的值在IE和FF下正常,但document.body.scrollTop一直为0。在Chrome下就反过来了。
labeller_layer是一个我想随着滚轮移动的层
以上是针对onscroll事件平台兼容性的一个总结
分享到:
相关推荐
onscroll事件揭秘
滚动条滚动到页面底部事件js,兼容浏览器
在做js返回顶部的效果时,要监听网页滚动条滚动事件,这个事件就是:[removed]。当onscroll事件发生时,用js获得页面的scrollTop值,判断scrollTop为一个设定值时,显示“返回面部” js网页滚动条滚动事件 <...
今天测试发现IE6下用[removed],每次滚动时会触发3次,而火狐、IE7没此问题,应该是IE6的一个BUG
的内容是说说最近在工作中遇到过的常见的问题。主要是关于JavaScript触发onScroll事件的函数节流,文中由一个常见的问题开始展开,一步步的介绍解决的方法,有需要的朋友们下面来跟着小编一起看看吧。
主要介绍了javascript简单实现跟随滚动条漂浮的返回顶部按钮效果,涉及javascript基于onscroll事件动态改变页面元素样式的相关技巧,需要的朋友可以参考下
Vue动画控制一个简单的Vue指令,可在元素滚动到视图中时对其进行动画处理。安装npm install vue-animate-onscroll# oryarn add vue-animate-onscroll建立导入到您的Vue应用程序import Vue from 'vue'import ...
OnScroll可以将滚动事件与浏览器解耦,以最大程度地减少其引起的重量。 回调函数在requestAnimationFrame()-Call中运行以优化呈现。 通过在应执行回调函数时提供超时,可以进一步减轻权重。 用法 HTML < ...
主要给大家介绍了关于React.Js添加与删除onScroll事件的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
window 的 onload、onresize、onscroll 事件,跟其他的事件不一样,它不能用 attachEvent 或 addEventListener 来添加。也就是说,它只能这样来(以 onload 为例,下同): 代码如下: [removed] = function() { // ...
如果要出现水平滚动条,则: overflow-x:auto同理,垂直滚动条为: overflow-y:auto如果该div被包含在其他对象例如td中,则位置可设为相对:position:relative 例如: <HTML> <HEAD> <TITLE>...
首先是为DIV添加一个onscroll=”[removed]setScollTop()” 的方法(当然不一定...这里setScrollTop方法就是每次滚动条滚动的时候,把div的ScrollTop的值赋给一个隐藏控件。代码如下 代码如下:function setScollTop()
执照支持 特征沿任何方向在任何元素内平滑滚动中心元素极其精确一次处理多个滚动动画高性能检测onScroll事件并区分用户滚动条和实用程序滚动条对元素位置变化做出React自定义用于动画滚动的缓动功能打字稿支持 安装...
首先实现滚动要借助onscroll事件处理程序。 无穷滚动就是滑动滚动条,实现数据块的无穷加载。 我们以瀑布流的布局来实现无穷加载。瀑布流就是一些等宽不等高的数据块布局。在滚动条下拉时,它会进行加载。那么...
如下所示: this.$nextTick(() => { const el = document.querySelector('.act-not'); const offsetHeight = el.offsetHeight; el.onscroll = () => { const scrollTop = el....坑:在做滚动加载分页时候,有时候第三
HTML中与javascript交互是通过事件驱动来实现的,例如鼠标点击事件、页面的滚动事件onscroll等等,可以向文档或者文档中的元素添加事件侦听器来预订事件。想要知道这些事件是在什么时候进行调用的,就需要了解一下...
基于jquery的滚动固定位置广告位插件,支持自定义偏移量。 用法: window.onscroll=function(){floatWin("branding","right","top")} ...IE6采用JS方式控制滚动(CSS表达式方式会有资源损耗过大性能问题)