CODEWITHSUNDEEP
javascriptjquery
user9030616
user9030616

Reputation: 35

Apply browser height and width to the div

May I know why is my div block is not showing? Anyone can explain to me? https://jsfiddle.net/sw64j5qc/8/

function deviceSize() {
var myWidth = 0, myHeight = 0;
var block = document.getElementById("test");

if( typeof( window.innerWidth ) == 'number' ) {
  //Non-IE
  myWidth = window.innerWidth;
  myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
  //IE 6+ in 'standards compliant mode'
  myWidth = document.documentElement.clientWidth;
  myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
  //IE 4 compatible
  myWidth = document.body.clientWidth;
  myHeight = document.body.clientHeight;
}
block.style.width = myWidth;
block.style.height = myHeight;

window.alert( 'Width = ' + myWidth );
window.alert( 'Height = ' + myHeight );

} deviceSize();

Upvotes: 1

Views: 36

Answers (2)

CodeAt30
CodeAt30

Reputation: 884

You are passing just the numbers to the property instead of passing a string that specifies pixels:

block.style.width = myWidth + "px";
block.style.height = myHeight + "px";

Upvotes: 1

Herco
Herco

Reputation: 342

Your div does not have any content, what happens if you try

<div id="test" style="background-color: #000;">Some content here</div>

Upvotes: 0

Related Questions