让页面出现滚动条的时候,滚动条不影响页面宽度
2014-04-10 12:01
686 查看
设置body的宽度为window的宽度(以下脚本控制)
同时设置body的overflow(样式里写)
ps:
同理,div里面的table也是这样处理
![](https://oscdn.geek-share.com/Uploads/Images/Content/202010/14/96e40cafd7acdbccc3fcc976a5ee1326)
![](https://oscdn.geek-share.com/Uploads/Images/Content/202010/14/7158cbacb4a08f462659f5c124bc144c)
设置tableContainer(样式里写)、tableMain(脚本控制)的宽度等于tableMainHead的宽度
设置tableContainer的overflow为hidden(样式里写)
这样做带来一个缺点,就是浏览器窗口大小变化的时候,body里面的内容不能自动居中(原本用百分比做宽度设置的div等是可以使用margin:auto自动居中的,现在将多出来的部分hidden了,就不能自动居中了)
$("body").css("width", $(window).width());
同时设置body的overflow(样式里写)
body{ overflow-x: hidden;}
ps:
同理,div里面的table也是这样处理
设置tableContainer(样式里写)、tableMain(脚本控制)的宽度等于tableMainHead的宽度
$(".tableMain").css("width", $(".tableMainHead").css("width"));
设置tableContainer的overflow为hidden(样式里写)
这样做带来一个缺点,就是浏览器窗口大小变化的时候,body里面的内容不能自动居中(原本用百分比做宽度设置的div等是可以使用margin:auto自动居中的,现在将多出来的部分hidden了,就不能自动居中了)
相关文章推荐
- html 滚动条不影响页面宽度
- html关于强制显示、隐藏浏览器的滚动条,解决由于高度变化带来的滚动条影响页面宽度的问题
- query.nicescroll页面初始化无滚动条,等到撑开到应该出现滚动条的时候还是不出现
- DIV里Table的宽度设置为100%后页面出现滚动条的解决办法;DIV下移的解决办法 IE 和 FireFox 都通过
- 1024*768 固定多少宽度才不会出现滚动条
- 纯CSS让overflow:auto页面滚动条出现时不跳动
- 小tip:纯CSS让overflow:auto页面滚动条出现时不跳动
- Silverlight页面在兼容/高速模式下出现滚动条的解决办法
- 解决MyEclipse联网编辑JSP页面出现类、方法等提示信息的时候出现死机、假死等问题的办法
- 页面滚动条到一定高度后出现置顶按钮
- 页面出现滚动条后会左移的处理方法
- 解决MyEclipse联网编辑JSP页面出现类、方法等提示信息的时候出现死机、假死等问题的办法
- CSS vw让overflow:auto页面滚动条出现时不跳动
- 精确地计算Web页面中滚动条的宽度
- 水滴石穿之子页面的滚动条设置 表格的固定高度宽度问题 复制带格式的文本
- CSS3计算calc和vw单位巧妙实现滚动条出现页面不跳动
- JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度。判断出现滚动条
- extjs 3.4 在IE8下,tabPanel会同时出现纵向、横向滚动条的情况。影响用户体验。
- javascript 获取滚动条高度+常用js页面宽度与高度
- DIV+CSS 布局一行两列,左列固定宽度,右列自适应宽度;设置最小宽度,窗口小的时候显示滚动条.