使用Javascript扩展响应式HTML的背景图片

Question

I got stuck for hours in this code, trying to modify HTML's background so that it can be automatically resized as the browser's resized by user, i'm trying to modify that through javascript : (i'm in firefox btw)

GM_addStyle('body {background-image: url("chrome://browserbackgrounds/content/browserbackgrounds
/Generic/Backgrounds/wall.jpg")}');

var images = document.getElementsByTagName ("img");
var x=0;
while(x<images.length)
{
if(images[x].src == "https://www.google.com/images/nav_logo170.png")
{
images[x].src = "chrome://browserbackgrounds/content/browserbackgrounds/Generic/Backgrounds   
/wall.jpg";
}
x=x+1;
}

now below is the part where i got stucked

document.getElementById("gsr").style.MozBackgroundSize="Cover";
document.getElementById("gsr").style.WebkitBackgroundSize="Cover";
document.getElementById("gsr").style.OBackgroundSize="Cover";
document.getElementById("gsr").style.BackgroundSize="Cover";

Answer 1

Did you try with backgroundSize ? (notice the lowercase initial b ). Same for the rest of properties, they need to be camelCased .