如何使用JavaScript将背景图像置于网页上以获得不同的屏幕分辨率？

Question

我想确定客户端计算机的屏幕分辨率,并使用JavaScript在中心设置背景图像.

我到目前为止:

function centerBackGroundImage()
{
    var browserWidth = document.documentElement.clientWidth;
    var browserHeight = document.documentElement.clientHeight;
    $("#background").css({ "z-index": "-10", "margin:left": (browserWidth / 2) - (browserHeight/ 2) });
}

我已经添加了名为div的标签background和<img>带有图像文件位置的标签.

任何帮助,将不胜感激.

Answer 1

你不需要JavaScript.你可以用CSS做到这一点background-position:

#background {
     background-image: url('https://www.google.com/images/srpr/logo3w.png');
     background-position: center;
     background-repeat: no-repeat;
}

演示 - 它也可以在元素内部工作,而不仅仅是body在我的例子中.