用overflow-y 解决web页面抖动问题
页面抖动(左右抖动)让人视觉上很不爽。。
/**
original : php攻城师
**/
最开始我也以为是 layout 不一致的原因。。后来才发现是 因为垂直滚动条 时隐时现导致的
当页面内容在一页上没有展示完的时候, 浏览器右端会出现 垂直滚动条
反之, 这个 垂直滚动条默认是隐藏的
so, 当页面切换的时候,就会剧烈抖动起来。。。
解决方法:
添加 CSS :
body {
overflow-y: scroll;
}
备注:
值 | 描述 |
---|---|
visible | 默认值。内容不会被修剪,会呈现在元素框之外。 |
hidden | 内容会被修剪,并且其余内容是不可见的。 |
scroll | 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。 |
auto | 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。 |
inherit | 规定应该从父元素继承 overflow 属性的值。 |
用overflow-y 解决web页面抖动问题的更多相关文章
- web页面乱码,JSP页面编码设置
解决Web页面访问出现乱码bug,JSP页面首行添加: <%@ page language="java" contentType="text/html; chars ...
- (转)解决bootstrap 模态框的页面抖动
使用bootstrap时,往往会出现页面抖动的效果,使得用户体验十分不友好. Bootstrap为了让所有的页面(这里指内容溢出和不溢出)显示效果一样,采取的方法如下: 当Modal显示时,设置bod ...
- Bootstrap3-技巧之解决Bootstrap模态框切换时页面抖动 or页面滚动条
Bootstrap为了让所有的页面(这里指内容溢出和不溢出)显示效果一样,采取的方法如下: 当Modal显示时,设置body -- overflow:hidden;margin-right:15px; ...
- 解决Bootstrap模态框切换时页面抖动 or页面滚动条
Bootstrap为了让所有的页面(这里指内容溢出和不溢出)显示效果一样,采取的方法如下: 当Modal显示时,设置body -- overflow:hidden;margin-right:15px; ...
- 集群重启后启动ambari-server访问Web页面无法启动集群解决
集群重启后启动ambari-server访问Web页面无法启动集群解决 使用ambari部署的集群重新启动后,必须手动重启ambari-server和所有集群主机上的ambari-agent. amb ...
- 解决VS2010打开Web页面时经常由于内存较低而导致VS2010自动关闭的问题
在使用VS2010 开发Web应用程序的时候,经常打开一个Web页面进行编辑前台代码的时候要等待很久(甚至等了半天结果还挂掉,简直令人抓狂), 之前也在网上找了很多相关的方法,都没办法解决,今天无意中 ...
- ios访问web页面<div>点击事件不起效果,以及alert()显示url的解决办法
ios访问web页面<div>点击不起效果,在其div上添加style=”cursor:pointer:“ jquery web页面动态append()事件调用方法:$(document) ...
- 记Outlook插件与Web页面交互的各种坑 (含c# HttpWebRequest 连接https 的完美解决方法)
1) 方案一, 使用Web Service 基础功能没问题, 只是在连接https (ssh) 网站时, 需要针对https进行开发 (即http 和https 生成两套接口, 不太容易统一 ). ...
- Juniper SRX550防火墙web页面CPU达到100%的故障解决办法
Juniper SRX550防火墙web页面CPU达到100%的故障解决办法 利用telnet远程连接主机,对web页面注销重新登录即可,在配置中输入命令:run restart web-manage ...
随机推荐
- BZOJ 1644: [Usaco2007 Oct]Obstacle Course 障碍训练课( BFS )
BFS... 我连水题都不会写了QAQ ------------------------------------------------------------------------- #inclu ...
- uoj #2 【NOI2014】起床困难综合症 贪心+位运算
题目链接 给出n个数, 每个数有特定的一种操作, &|^三种, 给出一个m, 初始值属于[0,m],选定一个初始值, 使所有操作做完之后的值最大, 输出这个最大值. 1, 从最高位贪心, 如果 ...
- U-Boot在FL2440上移植(四)----支持网卡DM9000和烧写yaffs文件系统
<一>支持网卡芯片DM9000 在driver下,有网卡驱动DM9000x.c 和 DM9000x.h DM9000接在BANK4,位宽16 在include/configs/TX2440 ...
- QNetworkAccessManager跳转URL处理(使用QNetworkRequest::RedirectionTargetAttribute获得跳转URL)
connect(manager, SIGNAL(finished(QNetworkReply*)), this, SLOT(onFinished(QNetworkReply*))); void Mai ...
- QT学习 之 文本文件读写
上一章我们介绍了有关二进制文件的读写.二进制文件比较小巧,却不是人可读的格式.而文本文件是一种人可读的文件.为了操作这种文件,我们需要使用QTextStream类.QTextStream和QDataS ...
- springMVC框架下JQuery传递并解析Json数据
springMVC框架下JQuery传递并解析Json数据
- 在 Azure 网站上使用 Memcached 改进 WordPress
编辑人员注释:本文章由 Windows Azure 网站团队的项目经理 Sunitha Muthukrishna 和 Windows Azure 网站开发人员体验合作伙伴共同撰写. 您是否希望改善在 ...
- 一个包含所有c++的头文件的头文件
#include <bits/stdc++.h> 做CF看见别人用这个函数,然后就能直接用vector,set,string那些函数了,摸不着头脑,感觉特神奇就百度了一下,才发现这个是C+ ...
- Objective-C 类,实例成员,静态变量,对象方法,类方法(静态方法),对象,
Objective-C 类,实例成员,静态变量,对象方法,类方法(静态方法),对象, 一.类 在ios中,类的声明和实现时分离的,也就是说不能写在同一个文件中,声明放在 .h文件中,实现放在 .m 文 ...
- Android 开发之网易云音乐(或QQ音乐)的播放界面转盘和自定义SeekBar的实现
这个东西我在eoeAndroid上首发的,但没有详细的实现说明:http://www.eoeandroid.com/thread-317901-1-1.html 在csdn上进行详细的说明吧.(同时上 ...