简体   繁体   中英

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();

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";

您的 div 没有任何内容,如果您尝试会发生什么

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

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM