javascript-“扩展”网页以适应页脚

前端之家收集整理的这篇文章主要介绍了javascript-“扩展”网页以适应页脚 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在构建一个将HTML iframe“工具栏”注入每个网页底部插件.通过注入以下代码,我实现了“粘性页脚”行为:

<iframe frameborder="0" noresize="noresize" src="http://example.com/toolbar.html" style="position:fixed; background:transparent; width:100%; height: 33px; padding:0; bottom: 0px; z-index: 2px;"></iframe>

但是,此iframe与网页的底部30个像素重叠.我要寻找的是如何将每个网页“扩展” 30个像素,以便我们的栏具有页脚的所有行为(它始终显示在屏幕底部),但是用户仍然可以滚动到底部网站,然后查看该网站最底部内容. (不使用传统框架,这会引起其他问题.)

附加信息

Stumble Upon for Chrome已在窗口顶部实现了此行为(即,向下滚动栏“推动”内容向下而不是使其重叠).

最佳答案
我会在主体上添加padding-bottom:33px.

更新

如果html和body标签都具有height:100%,则以上答案将无效.

抓身体的技术,然后做.

html{
  height:auto!important;
  height:100%;
  min-height:100%;
  padding-bottom:33px;
}

我想不出这会弄乱任何东西的情况.

猜你在找的CSS相关文章