css页面滚动条出现时防止页面跳动的方法
2024-09-27 11:17:05
大家写页面时应该都遇到过一个问题，尤其是写单页面应用的时候，
在有滚动条页面和没有滚动条页面之间相互跳转时，
你页面的主体内容会向左或者向右抖一下，让强迫症看了很不舒服。
现在就来解救一下强迫症：
方法一： 不管有没有滚动条，都保留滚动条区域
body{overflow-y: scroll;}
方法二：CSS3计算calc和vw单位巧妙实现滚动条出现页面不跳动(兼容IE9+以及其他现代浏览器)
你希望不抖动的元素{padding-left: calc(100vw - 100%);}
方法二最好别给body加padding-left: calc(100vw - 100%);因为有滚动条时，页面最左边也会出现空白；
所以最好单独给页面的主要元素加padding-left: calc(100vw - 100%);
最新文章
- Python 历遍目录
- py-faster-rcnn搭配pycharm使用
- 最完整的Elasticsearch 基础教程
- FastDFS+Nginx轻量级分布式
- SqlServer 列的增加和删除
- ASP.NET MVC——Controller的激活
- AngularJS track by $index引起的思考
- CentOS 6.3 源码安装LAMP(Linux+Apache+Mysql+Php)环境
- USACO Milk2 区间合并
- 【G】开源的分布式部署解决方案文档 - 使用手册
- QEMU模拟器Windows版本模拟ARMX86CPU指令
- BAT:通过连接符处理判断OR的关系
- Python元组(tuple)
- 学习REST
- Java中集合删除元素时候关于ConcurrentModificationException的迷惑点
- GYM 101064 2016 USP Try-outs G. The Declaration of Independence 主席树
- h5py库安装问题解决
- 渐变显示渐变消失的BackgroundView
- 使用IntelliJ IDEA，gradle开发Java web应用步骤
- 「6月雅礼集训 2017 Day5」吃干饭