Pozadí podle rozlišení - javascript – JavaScript, AJAX, jQuery – Fórum – Programujte.com

Ahoj,

mám problém s pozadím hlavičky. Chtěl bych udělat něco jako je tohle: http://halfcreative.themes.bitfade.com/. 
S js zkušenosti nemám, ale myslím, že by to přes to šlo udělat nejlépe. 

Nějaké nápady?   

<script>
var sirka=document.body.clientWidth;
var vyska=document.body.clientHeight;
</script>

Tímto zjistíš velikost zobrazeného okna, poté na to můžeš připojit nějaký script. Mě ted napadá napříkald využití DOM
 

<script>
var headdiv=document.createElement("div");
//var headdiv=document.createElement("header"); //pro HTML5
headdiv.style.display="block";
headdiv.style.width=sirka + "px";
//headdiv.style.width="100%"; //taky by melo fungovat
headdiv.style.height=vyska + "px";
//potom bys potreboval nejaky velky obrazek ktery by se vesel
//na vsechny velikosti obrazovek, zabiral by hodne mista
//reseni by vypadalo takto
headdiv.background="url('obrazek.jpg') no-repeat center top";
//pokud bys to mel vice obrazku tak bys napsal nejake podminky na velikost
//prikaz by byl stejny jen s jinymi obrazky
//nakonec ho pridas do stranky
var body=window.document.getElementByTagName("body");
body.insertBefore(headdiv,body.firstChild);
</script>

btw nejsem si jisty jestli je mozne zapsat ze .style.width=cislo + "px"; prinejhorsim by sis vytvoril dalsi promenou jako var sirkaDivu=cislo+"px"; a potom bys napsal jen style.width=sirkaDivu;

Jinak bys jeste musel dodelat obsah toho divu, asi opet pres DOM popripade trosku amatersky pres innerHTML.

snad jsem poradil dobře a nenapsal jsem tam nějake kraviny :D