style.width不適用於innerWidth

我想動態地插入一個div，它的寬度等於使用window.innerWidth屬性的頁面寬度。style.width不適用於innerWidth

它似乎不工作，寬度自動設置爲'0'。

在此先感謝。

HTML

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

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

例小提琴：http://jsfiddle.net/xyyUy/1

來源

2014-03-29 Rishi

什麼身體裏面？另外你爲什麼不單獨使用CSS來控制它呢？ JS似乎矯枉過正。 – Pogrindis

身體是空的，其實我正在學習這個概念，所以一切都使用js。 – Rishi

而小提琴：http://jsfiddle.net/xyyUy/1/ – Rishi

您fogot添加「PX」與寬度值

應該

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

代替

x.style.width=w;

來源

2014-03-29 04:39:21

是的，它表示感謝。 – Rishi

不客氣。:) –

正如@Suman Bogati說你需要添加 '像素'。你的小提琴也在執行lb（）函數時發生錯誤。我在這個小提琴上調整了它的工作。我只是做給

lb();

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

來源

2014-03-29 04:47:36

一個簡單的通話這裏是腳本

<script type='text/javascript'>//<![CDATA[ 
function lb() { 
      console.log('adsf'); 
      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 child = document.getElementById("tri"); 
      var x = document.createElement("div"); 
      x.id = "heder"; 
      x.style.width = w+'px'; 
      x.style.height = '150px'; //adjust your height as adjusted width 
      x.style.backgroundColor = '#000000'; 
      x.style.position = 'absolute'; 
      x.style.margin = '0px'; 
      x.style.padding = '0px'; 
      document.body.appendChild(x); 

}//]]> 
</script>

下面是HTML

<body onload="lb()"> 

</body>

來源

2014-03-29 04:49:09 sanjeev

style.width不適用於innerWidth

回答

相關問題