当前位置:网站首页>解决浏览器滚动条导致的页面闪烁问题
解决浏览器滚动条导致的页面闪烁问题
2022-08-01 05:18:00 【集电极】
解决浏览器滚动条导致的页面闪烁问题
说明
我网页初始加载时网页内容没有占满整个高度,后面随着我添加内容,当内容接近浏览器底部时,导致滚动条忽然出现,此时就出现了页面闪烁情况。
css 解决方法
1 方式1
/*方式1 推荐*/
.wrap-outer{
margin-left: calc(100vw - 100%);
}
首先,.wrap-outer指的是居中定宽主体的父级,如果没有,创建一个。
如果是全局滚动条导致的闪烁,也可以尝试设为body
标签,不过要自行测试一下。
如我的body{ margin-left: calc(100vw - 100%); }
2 方式2 给html设置样式
html{
margin-right: calc(100% - 100vw);
overflow-x: hidden;
}
方式2 经过我的测试,浏览器不会出现闪烁了,但会导致我下面的滚动条
不会
出现。
小tip:CSS vw让overflow:auto页面滚动条出现时不跳动 « 张鑫旭-鑫空间-鑫生活 (zhangxinxu.com)
边栏推荐
- Power button (LeetCode) 212. The word search II (2022.07.31)
- High Numbers | 【Re-integration】Line Area Score 880 Examples
- 挑战52天背完小猪佩奇(第01天)
- Pyspark Machine Learning: Vectors and Common Operations
- 剑指 Offer 68 - I. 二叉搜索树的最近公共祖先
- Seleniu:元素常用操作
- 用控件当画笔获得bitmap代码记录
- About making a progress bar for software initialization for Qt
- Code Interview Guide for Programmers CD15 Generating an Array of Windowed Maximums
- typescript27 - what about enumeration types
猜你喜欢
AspNet.WebApi.Owin 自定义Token请求参数
typescript28 - value of enumeration type and data enumeration
HJS-DE1/2时间继电器
UE4 rays flashed from mouse position detection
(2022牛客多校四)D-Jobs (Easy Version)(三维前缀或)
中国的机器人增长
移动应用恶意攻击激增500% 三六零天御为APP免费构建安全屏障
剑指 Offer 68 - I. 二叉搜索树的最近公共祖先
程序员代码面试指南 CD15 生成窗口最大值数组
Qt Widget 项目对qml的加载实例
随机推荐
使用string 容器翻转 字母
Swastika line-by-line parsing and realization of the Transformer, and German translation practice (2)
Robot_Framework:断言
Selenium:操作JS
[target detection] YOLOv7 theoretical introduction + practical test
Challenge 52 days to memorize Peppa Pig (Day 01)
pytorch、tensorflow对比学习—功能组件(优化器、评估指标、Module管理)
LeetCode 27. 移除元素
【MySQL必知必会】 表的优化 | 充分利用系统资源
文件的异步读写
牛客多校2022第四场A,H,K,N
Asynchronous reading and writing of files
pytroch、tensorflow对比学习—功能组件(数据管道、回调函数、特征列处理)
torch
(Codeforce 757) E. Bash Plays with Functions
In the shake database, I want to synchronize the data of the source db0 to the destination db5, how to set the parameters?
2022年超全的Android面经(附含面试题|进阶资料)
Dry goods!How to Construct SRv6-TE Performance Test Environment Using Instrumentation
WPF项目-按着键盘方向键,移动格子盒子效果
A,H,K,N