`
再逢山水
  • 浏览: 156324 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

关于scrollTop为0以及解决方法

阅读更多
没有DOCTYPE声明的时候document.body.scrollTop一切正常

有DOCTYPE声明的时候document.body.scrollTop总是输出0; 需要用document.documentElement.scrollTop方法来获取滚动条高度。

所以我们需要用到if…else…去判断。

如果有DOCTYPE声明,我们该怎么办

如果没有DOCTYPE声明,我们该怎么办。

var scotop ;
if(document.body.scrollTop)
{
	scotop = document.body.scrollTop;
}
else{
	scotop = document.documentElement.scrollTop
}


这样判断后,就可以在两种情况下同时使用了。IE6,IE7,FF2测试通过.
分享到:
评论

相关推荐

    火狐、谷歌、IE关于document.body.scrollTop和document.documentElement.scrollTop 以及值为0的问题

    在探讨“火狐、谷歌、IE关于`document.body.scrollTop`和`document.documentElement.scrollTop`以及值为0的问题”这一主题时,我们深入分析了浏览器在处理页面滚动位置时的不同行为,尤其是当滚动位置值始终为0时的...

    解决VUE中document.body.scrollTop为0的问题

    对于移动端的滚动事件监听,Vue同样提供了一套解决方案,例如可以使用Vue的v-on指令来监听滚动事件。此外,对于滚动性能优化,Vue也提供了一些内置的方法和策略,比如使用debounce或throttle来防止滚动事件处理函数...

    document.body.scrollTop 值总为0的解决方法 比较常见的标准问题

    在本文中,我们将探讨`document.body.scrollTop`在某些情况下值为0的问题以及解决方案。 问题的核心在于`document.body.scrollTop`在具有DTD(Document Type Definition)的页面上可能不会如预期般工作。DTD 是一种...

    解决vue单页路由跳转后scrollTop的问题

    最开始我使用了一个很笨的方法,每个页面上都加上window.scrollTop(0,0);来解决问题,但是这个太繁琐了。最后和小伙伴们商量了一下,在main.js页面上加了这么一段代码 router.afterEach(function (to) { window....

    Document.body.scrollTop的值总为零的快速解决办法

    问题的解决方案是检查并确保你的代码能够适应不同浏览器和解析模式的行为。你可以使用如下方式来兼容性地获取滚动位置: ```javascript // 获取页面滚动位置 function getScrollTop() { return window.pageYOffset...

    使用scrollTop()解决IOS中输入法遮挡输入框问题

    使用 scrollTop() 函数可以解决 IOS 中输入法遮挡输入框问题,该方法简单易行,且无需使用其他复杂的解决方法。希望这篇文章能够对您有所帮助。 六、结语 本文系小编给大家介绍的使用 scrollTop() 函数解决 IOS 中...

    javascript中scrollTop详解

    本文将详细讲解`scrollTop`的使用方法、原理、以及在不同浏览器中的兼容性问题和解决方案。 首先,`scrollTop`属性可以在`window`对象以及任何带有滚动条的DOM元素上使用,如`document`、`document.body`以及任何...

    vue项目设置scrollTop不起作用(总结)

    本文总结了在Vue项目中设置scrollTop不起作用的问题,并提供了解决方案。 问题描述: 在开发过程中,当页面内容较长,分为多个模块,每个模块都有对应的标题,点击标题后需要滚动到相应模块内容位置。为了实现这一...

    滚动穿透的6种解决方案【已自测】.docx

    其余的解决方案包括使用`iscroll`库、使用`Hammer.js`进行手势管理以及使用`Vue`或`React`等框架的特定解决方案,它们通常涉及更复杂的交互处理和事件监听。 总结来说,选择哪种解决方案取决于项目的具体需求和当前...

    针对 iOS端禁止列表顶部下拉和底部上拉露出浏览器灰色背景 的解决方案。

    针对这个问题,本文将提供一种解决方案,帮助开发者消除这个现象,确保用户在浏览过程中始终看到的是应用自定义的界面背景。 首先,我们要理解这种现象的根源。在iOS的Safari或其他基于WKWebView的浏览器中,当用户...

    【前端词典】滚动穿透问题的解决方案.docx

    然而,这种方法的一个副作用是,`body`的滚动位置会丢失,`scrollTop`属性会被重置为0。这对于用户体验来说是不理想的,因为它破坏了用户的浏览进度。 为了解决这个问题,我们可以采用方案二,即在打开弹窗前保存...

    jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题

    接下来,我们将深入探讨`animate()`的使用方法以及如何解决在Firefox中不支持`$("body").animate({"scrollTop":top})`的问题。 首先,让我们了解`animate()`的基本语法: ```javascript $(selector).animate...

    关于scrollLeft,scrollTop的浏览器兼容性测试

    它们首先尝试获取 `element.scrollLeft` 或 `element.scrollTop`,如果值为0,则尝试从 `document.documentElement` 获取。这样,无论浏览器如何实现,都可以得到正确的滚动位置。 在实际应用中,这个封装的 `...

    css ie6 fiexd属性解决方法

    在探讨“css ie6 fixed属性解决方法”这一主题时,我们不得不面对一个历史遗留问题:Internet Explorer 6(IE6)对于CSS3中fixed定位的支持不足。IE6发布于2001年,其浏览器内核对现代Web标准的支持有限,尤其是在...

    vue 解决文本框被键盘遮住的问题

    document.getElementById(this.FullScreenId).scrollTop = document.getElementById(this.FullScreenId).scrollHeight 我这边把div满屏了看下面css就知道了 你也可以使用body,这个你行百度一下就可以了 注意点是css...

    微信H5页面兼容性解决方案.docx

    ### 微信H5页面兼容性解决方案 #### 一、概述 随着移动互联网的发展,H5页面成为企业和品牌与用户沟通的重要渠道之一。然而,在不同的操作系统和浏览器环境下,H5页面经常会遇到各种兼容性问题,这些问题直接影响...

    JavaScript限制在客户区可见范围的拖拽(解决scrollLeft和scrollTop的问题)(2)

    整个解决方案的核心在于正确地计算元素的新位置,并考虑页面滚动对元素位置的影响,确保元素始终在可视区域内。通过这种方式,我们可以创建一个流畅的、在客户区可见范围内的拖拽体验,即使页面有滚动条。这对于实现...

    IOS 的弹性滚动解决方案

    可以使用`scrollTop`属性设置为0,像这样:`document.getElementById('target').scrollTop = '0px';` 3. **重新应用`overflow-scrolling`**:在目标元素上重新应用`-webkit-overflow-scrolling: touch;`属性,以...

Global site tag (gtag.js) - Google Analytics