style.width is not working for innerWidth

I am trying to insert a div dynamically with it's width equal to the page width using the window.innerWidth property.

It doesn't seem to work and the width is set to '0' automatically.

Thanks in advance.

HTML

<body onload="lb()"></body>

JS

function lb()
{
var h=window.innerHeight
||document.body.clientHeight
||document.documentElement.clientHeight;

var w=window.innerWidth
||document.body.clientWidth
||document.documentElement.clientWidth;

                    alert("Width: "+w+"\n"+"Height: "+h);

        var x=document.createElement("div");
        x.id="heder";
        x.style.width=w;
        x.style.height='150px';
        x.style.backgroundColor='#000000';
        x.style.position='absolute';
        x.style.margin='0px';
        x.style.padding='0px';

              document.body.appendChild(x);
}

Example fiddle : http://jsfiddle.net/xyyUy/1

Answers


You fogot to add "px" with width value

should be

    x.style.width=w+"px";

instead of

    x.style.width=w;

As @Suman Bogati said you need to add the 'px'. Also your Fiddle was throwing an error executing the lb() function. I tweaked it in this fiddle to work. I just did a simple call to

lb();

http://jsfiddle.net/xyyUy/2/


Need Your Help

What is the proper way to enable character protrusion in xelatex?

xetex xelatex

I am using XeTeX 3.1415926-2.2-0.9997.4 (part of TeX Live 2010). One of its new features is character protrusion, and I would like to use it in my documents. The problem is that I cannot make it wo...

XHTML to another XHTML with XSLT

java xml xslt xhtml

I have two XHTML files and my task is to convert from one to another with XSLT (or any other method by Java Program). I searched but I didn't get any example for this, all are related for convertin...