如下移动端索引列表页面(点击某元素后弹出的页面)

    我想用 $(window).scrollTop(); 获取页面滚动后距离顶部的距离,但获取到的值总是0

  

   期间查了很久,但都无疾而终,后来看到一篇博客说是浮动影响了,抱着试一试的心态去清除浮动,然而并卵

    此时,我灵光一闪,难道是定位影响了?(这个弹出页面最外层用了 fiexd 固定定位)
  

   于是我取消固定定位,终于可以用 $(window).scrollTop(); 获取到高度了

  

  正当我欣喜之时,页面布局出现混乱,因为取消固定定位后,索引列表页面就不在脱离文档流了

  

  注:目前我不知道应该怎么解决这个问题(能获取到滚动后距离顶部的高度又不会造成布局混乱)如果有小伙伴有好的方法,欢迎留言指教,感谢

  

  补充:PC端获取页面滚动后到顶部距离最好用下面的方式,这样可兼容所有主流浏览器

    document.documentElement.scrollTop || document.body.scrollTop;

   

固定定位导致$(window).scrollTop();获取滚动后到顶部距离总是为0的更多相关文章

  1. jquery获取元素到页面顶部距离

    jquery获取元素到页面顶部距离的语句为: $(selector).offset().top

  2. iOS 固定定位不兼容、input获取焦点后位置不对。

    第一次写博客~  大家悠着看,有则改之,无则加冕,对不对的给个回复,让我知道你的存在. 在做活动页的时候,经常会碰到一些需要弹出显示的输入框(情节前提:本人安卓机~),前天自己写的时候自己调试没问题后 ...

  3. $(window).scrollTop() 获取当前的鼠标位置 offset.left()指定标签在html中的坐标 offset.top() 指定标签在html中的坐标position() 指定标签相对父(relative)标签的坐标

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 我是如何通过debug成功甩锅浏览器的:解决fixed定位元素,在页面滚动后touch事件失效问题

    如果你关注我应该知道,我最近对PC端页面进行移动适配.在这个过程中,为了节省用户300ms的时间,同时给予用户更及时的点击反馈(这意味着更好的用户体验),我在尝试使用移动端独有的 touchstart ...

  5. iOS tableView 滚动后回到顶部

    - (void)scrollViewDidScroll:(UIScrollView *)scrollView { CGPoint contentOffsetPoint = self.tableView ...

  6. jquery的固定定位效果

    今天做了个固定定位的效果.比如对导航需要进行固定定位效果: 当没有滚动到导航下面,导航正常显示. 当滚动到导航下面,导航就固定到顶部. 这个效果使用了jquery的方法实现,具体思路为: 1)首先获取 ...

  7. $(document).scrollTop()与$(window).scrollTop()

    $(document).scrollTop() 获取垂直滚动的距离 即当前滚动的地方的窗口顶端到整个页面顶端的距离 要获取顶端 只需要获取到scrollTop()==0的时候 就是顶端了 要获取底端 ...

  8. js,jquery 获取滚动条高度和位置, 元素距顶部距离

    一,获取滚动条高度和位置 jQuery 获取览器显示区域的高度: $(window).height();  获取浏览器显示区域的宽度:$(window).width(); 获取页面的文档高度:$(do ...

  9. input固定定位后,当input框获取到焦点时,会离开手机软键盘的解决方法

    前些天做页面时候遇到这样一个问题,将input框用position:fixed固定定位在最底部的时候,当Input获取焦点的时候,input框离开了手机软键盘,而不是吸附在软键盘上,效果如下图: 找了 ...

随机推荐

  1. Java生鲜电商平台-系统报表设计与架构

    Java生鲜电商平台-系统报表设计与架构 说明:任何一个运行的平台都需要一个很清楚的报表来显示,那么作为Java开源生鲜电商平台而言,我们应该如何设计报表呢?或者说我们希望报表来看到什么数据呢?   ...

  2. 一款好用的SSH工具“FinalShell”

    FinalShell是一体化的的服务器,网络管理软件,不仅是ssh客户端,还是功能强大的开发,运维工具,充分满足开发,运维需求. 特色功能:免费海外服务器远程桌面加速,ssh加速,双边tcp加速,内网 ...

  3. 使用jq操作脚本生成元素的事件

    其实这个很简单,是jq里面的一个delegate操作,具体如下: $("div").delegate("button","click",fu ...

  4. SharpGL之透视投影和摄像机

    当三维体放在世界坐标系中后,由于显示器只能用二维图像显示三维休,因此必须要依赖投影来把三维体降低维数. 投影变换的目的就是定义了一个视景体,使得视景体外多余的部分不会显示. 投影包括透视投影(pers ...

  5. 智能家居-2.基于esp8266的语音控制系统(硬件篇)

    智能家居-1.基于esp8266的语音控制系统(开篇) 智能家居-2.基于esp8266的语音控制系统(硬件篇) 智能家居-3.基于esp8266的语音控制系统(软件篇) 赞赏支持 QQ:505645 ...

  6. pymysql之有序字典

    #!/usr/bin/env python #-*-coding:utf-8-*- import pymysql import json import collections conn = pymys ...

  7. commons-dbutils【不推荐】

    Apache 组织提供的一个开源 JDBC工具类库,它是对JDBC的简单封装. 一般项目开发过程中,要么选择 ORM框架,要么自己编写DBUtils类+数据库连接池就足够了.

  8. LearnOpenGL.PBR.工作流贴图

  9. 编译一个支持django及mysqlclient连接的alpine镜像

    一切都不难,难的就是在alpine镜像里. 最后,使用了网上编译好mysqlclient的镜像,才搞定. 记录一下. 一,基础镜像Dockerfile https://github.com/tnir/ ...

  10. linux(05) 编译安装py3

    一.编译安装python3 https://www.cnblogs.com/pyyu/p/9015317.html 1.下载python3的源码 cd /opt yum install wget -y ...