javascript - 使用 Javascript 在页面底部为工具栏小部件创建一个空间

标签 javascript html css layout

我正在创建一个通过外部 javascript 文件加载的工具栏小部件。工具栏 float 在屏幕底部,效果很好,但屏幕底部的内容被遮盖了(如图 A 所示)。图B是我的目标。

工具栏应始终可见,固定在屏幕底部。如果页面需要滚动,内容将在其下方流动,直到滚动到底部时全部可见,这样任何长度的页面都不会被遮盖。

Before and after examples

我的第一个想法是将底部边距设置为 30 像素(工具栏高度),但由于大多数设计此设置的网站都设置为使用全屏(将主体高度设置为 100%),因此这不会总是工作。将 body scrollHeight 减小 30px 可以解决此问题,但前提是页面不需要滚动(有时需要)。

JSFiddle 示例:http://jsfiddle.net/ZbMDr/1/

最佳答案

这个例子对你有用吗? http://limpid.nl/lab/css/fixed/footer

关于javascript - 使用 Javascript 在页面底部为工具栏小部件创建一个空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8585321/

相关文章:

html - IE9/IE7 选择标签表现不同

html - 了解响应式图像和设备像素比

javascript - 有没有办法通过 SuiteScript 获取销售订单中 Material 行的系统信息(系统注释或更改历史记录)?

javascript - 为什么在没有循环或没有下一次调用给 PHP 文件的情况下不断打印这些值?

html - 在页面两侧的同一行显示按钮

jquery - 显示/隐藏标题

css - 如何在使用 css 悬停时平滑地翻转图像?

html - 如何防止从倾斜的父级继承的文本的转换

javascript - "Function calls are expensive"与 "Keep functions small"

javascript - JS 图片库