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)的页面中,在滚到到最极端(最上或者最下时),会拖动整个页面,带来不好的用户体验. 方法一,从网上找到的: ...
随机推荐
- hdu 6103 Kirinriki (枚举对称中心+双指针)
Problem Description We define the distance of two strings A and B with same length n isdisA,B=∑(i=0 ...
- 【HDU6602】Longest Subarray【线段树+分治】
题目大意:给出一串序列,询问最长的合法子串为多长,其中合法子串必须满足子串中[1,C]的数量大于等于K或者为0 题解: 定义右端点为包含某一点所需要的最小区间的右端点 那么初始化时就可以O(n)求出每 ...
- flutter Could not find the built application bundle
报错信息Could not find the built application bundle at build/ios/iphoneos/Runner.app. Error launching ap ...
- 【从0到1,搭建Spring Boot+RESTful API+Shiro+Mybatis+SQLServer权限系统】03、创建RESTful API,并统一处理返回值
本节应用Spring对RESTful的支持,使用了如@RestController等注解实现RESTful控制器. 如果对Spring中的RESTful不太明白,请查看相关书籍 1.创建一个数据对象, ...
- PHP基础知识总结(二) 数据类型、数组、变量和运算符
一.PHP是服务器端的脚本语言.在服务器端解析完成后,向前端浏览器发送html. PHP文件的部署位置在:xampp\htdocs文件夹下,当然这个位置可以修改.二.PHP基本语法 1.文件后缀名是p ...
- Python 工程师技能图谱skill-map
# **Python 工程师技能图谱** ## **入门**- 笨办法学Py- 官方教程- Hitchhiker- coursera * codeskulptor.org ## **进阶/脚本** # ...
- ceph-报错日志
由于时钟不一致问题,导致ceph存储有问题 clock skew时钟偏移overalladj. 全部的:全体的:一切在内的stampedadj. 铭刻的:盖上邮戳的:顿足的 beaconvt. 照亮, ...
- javsscript闭包的一种使用场景--沙箱
//沙箱:模块化,沙箱是一个隔离的环境,最大的好处就是避免全局变量的污染. var model = (function () {//一个匿名的立即执行函数 var price = 900;//这是 ...
- 用processing生成屏保程序
想法 利用随机数控制圆圈的大小.位置以及颜色,可以产生随机的美感. 让小球动起来,并且在屏幕边界处产生反弹效果. 代码 1: float circle_x = (float) 0.0; 2: floa ...
- 用Python实现一个简单的猜数字游戏
import random number = int(random.uniform(1,10)) attempt = 0 while (attempt < 3): m = int(input(' ...