position:fixed 造成页面抖动解决办法
今天做项目遇到一个问题。鼠标滚动到指定长度后，理想状况是菜单吸附到顶部。但是实际上在一些页面上会造成抖动。定位之后发现。window.pageYoffset值会变成0
搜索一些资料后发现。因为fixed定位后，这个div 就已经脱离文档流了。window.pageYoffset指的是document元素距离视窗的距离。所以导致window.pageYoffset变成了0
解决办法：
假设我们把fixed定位的div为divA, 那么在divA下面再写一个占位的div B,它的高度和divA一致，visible设为隐藏。用于占位文档流。这样就不会造成样式混乱了。
position:fixed 造成页面抖动解决办法的更多相关文章
- 解决ie6不支持position: fixed;导致无法滚动的办法
<div id="im" style="top: 100px; position: fixed; left: 5px; border: 3px solid #006 ...
- python print 打印的数据包含中文，打印报错UnicodeDecodeError: 'gbk' codec can't decode bytes in position 459-460: illegal multibyte sequence解决办法
python 2.7 print 的数据中若包括中文,打印则会报错UnicodeDecodeError: 'gbk' codec can't decode bytes in position 459- ...
- 移动端点击返回时强制页面刷新解决办法(pageshow)
在做移动端项目的时候经常遇到这样一个功能比如: 返回后页面不刷新,一些失效的信息依然显示在页面上.这个问题在iphone手机上会出现,在Android手机上返回时会自动刷新(由于手机机器种类不多,无法 ...
- UnicodeEncodeError: 'gbk' codec can't encode character '\xa0' in position 9865: illegal multibyte sequence 解决办法
解决办法 ; a=r.text.replace('\xa0',' ') 详情参见https://stackoverflow.com/questions/10993612/python-removing ...
- zencart后台管理中选项名称和选项内容和属性控制页面出错解决办法 WARNING: An Error occurred, please refresh the page and try again
后台管理中选项名称和选项内容和属性控制出现以下错误的解决办法WARNING: An Error occurred, please refresh the page and try again zen ...
- asp 文章内容里的图片宽度过大 撑爆页面布局 解决办法
有时候帮朋友做做企业网站,还是asp+access来的快,也经济(不用开数据库空间),fck做的后台内容编辑功能,但是他们传图片的时候不靠谱,图片不管有多宽都直接up上来,把前台页面撑的是面目全非! ...
- vue项目打包之后页面空白解决办法
之前项目遇到个情况,npm run build打包之后上传到服务器后,index.html打开一片空白,资源都加载了,但是就是不显示. 然后百度找了原因,修改了两处地方 一.修改 assetsPubl ...
- 前端跳转处理--房天下的访问页面部分ip自动跳转到登录页面的解决办法(xjl456852原创)
朋友说自己在访问房天下的页面时,他们页面进行了跳转,跳转到登录页面,说是前端跳转.让我也看看,我看我的机器没有进行跳转. 后来就发现有的机器在访问页面会自动跳转到登录页面.有的不会进行跳转. 比如访问 ...
- ios下使用overflow scroll情况下，到达最极端的情况时会拖动整个页面的解决办法
今天开发ipad webapp时,遇到个问题就是在支持内部滚动(overflow:scroll)的页面中,在滚到到最极端(最上或者最下时),会拖动整个页面,带来不好的用户体验. 方法一,从网上找到的: ...
随机推荐
- fedora下手动编译安装vim
据说手动编译安装可以更适合自己的电脑哦- 1.首先,我门要下载源文件,下载地址:ftp://ftp.vim.org/pub/vim/unix/ 选择一个最新版本,我这里选择的是 vim-7.4.tar ...
- linux查看java jdk jre安装路径和设置环境变量
一. 查看java jdk安装路径和设置环境变量 windows: set java_home:查看JDK安装路径 java -version:查看JDK版本 linux: whereis java ...
- （转）Android Studio启动AVD遇到的问题 （ HAXM安装失败）
转:https://zhidao.baidu.com/question/561420516357269084.html?qq-pf-to=pcqq.c2c Android Studio启动虚拟机的时候 ...
- Android 架构师技能图谱
# Android 架构师技能图谱 ## 架构与设计 - 设计模式 - 重构 - 技术选型 - 特性 - 可用性 - 性能 - 包大小 - 方法数 - 文档 - 技术支持 - UI架构模式 - MVC ...
- Java学习之接口
接口作用:为类提供额外功能(方法) 一.接口定义 interface IDemo { ;//可以简写:int NUM=4; public abstract void show();//可以简写:voi ...
- 【转】开源框架是如何通过JMX来做监控的(一) - JMX简介和Standard MBean
原文链接:https://www.cnblogs.com/trust-freedom/p/6842332.html#autoid-0-0-0 相信很多做Java开发的同学都使用过JDK自带的 jcon ...
- shell awk匹配字符串（从配置文件）
配置文件 config.properties xxx_yyy_lib_path="路径" xxx_yyy_bin_path="路径" 想通过shell来读入路径 ...
- Python文章导航
1.Python+Eclipse安装.配置: http://www.cnblogs.com/rhyswang/p/8087752.html 2.数学运算及math库: http://www.cnblo ...
- jmeter 5 参数化
文件: 文件编码 注意: 如果文件另存为utf-8,文件第一行头会带bom头(不可见字符),jmeter读取参数后,会把头读取到请求报文中,提示不存在该用户 什么是bom头? 在utf-8编码文件中B ...
- DB2命令行查看执行计划
查看对应SQL的执行计划 分析程序包 db2expln -d 数据库名 -i -g -c 模式名-p程序包 -s 0 -t db2expln -d 数据库名 -i -g -c 模式名-p程序包 ...