在HTML中围绕整个主体的元素的属性

时间:2012-07-11 09:00:43

标签: html css google-chrome-devtools

我有一个页面,我正在使用chrome控制台添加一个覆盖整个身体的SVG元素。 我在控制台中键入以下命令,

var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.style.position = "absolute";
svg.style.left = svg.style.right = svg.style.top = svg.style.bottom = "0px";
svg.style.opacity = 0.5;
svg.style['z-index'] = 100;
svg.style.width = "100%";
svg.style.height = "100%";
document.body.appendChild(svg);

但是SVG元素只覆盖显示的页面部分,即如果页面足够长以便我们必须向下滚动,则整个页面都不会被覆盖。

有什么建议吗?

1 个答案:

答案 0 :(得分:0)

如果要在视口处修复元素,请改用position:fixed;

否则,请勿使用100%,但是:

svg.style.height = Math.max(document.body.scrollHeight, 
    document.documentElement.scrollHeight) + 'px';