2014-09-20 90 views
0

我试图将我的'身体'背景图像放入浏览器文档大小。 这里的代码不会改变任何浏览器,当我运行它...我看到的图像,但它重复两次,大小不变。当调试我看到宽度和高度变量是正确的,但没有实际发生....任何想法? 我如何改变javascript中的身体背景图像大小?

$(function() { // onload...do 
 
var width = $(document).width(); 
 
var height = $(document).height(); 
 

 
$('body').css.backgroundSize = "" + width + "px " + height + "px"; 
 

 
});
body{ 
 
    background: url(../images/MainMenuScreen.jpg); 
 
}

回答

1

试试这个:

#yourdiv /* with CSS 3 */ 
{ 
background: url(../images/MainMenuScreen.jpg) no-repeat; 
background-size: 100%; 
} 
1

可以使用背景尺寸:涉及地产。使用“background-size:cover”属性会给你以下优点: 1.它用图像填充整个页面,没有空白区域 2.根据需要缩放图像 3.保留图像比例(高宽比) 4.图像集中 页5.不引起滚动尽可能 6.跨浏览器兼容

这里是CSS(如果你想让它适用于整个页面):

html { 
background: url(../images/MainMenuScreen.jpg) no-repeat center center fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 
} 

希望这有助于帮助