使用div填充整個屏幕

-1

在jquery中很簡單。只要做到以下幾點：使用div填充整個屏幕

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<body style="margin: 0; padding: 0"> 
<div id="test" style="background: black"></div> 
</body> 

<script> 
$('#test').width($(window).width()); 
$('#test').height("100%"); 
</script>

演示：

http://www.frostjedi.com/terra/scripts/demo/fullsize-jquery.html

在D3，但是，它不是很清晰。下面是我在做什麼：

<script src="http://d3js.org/d3.v3.min.js"></script> 
<body style="margin: 0; padding: 0"> 
<div id="test" style="background: black"></div> 
</body> 

<script> 
d3.select("#test").attr("width", window.innerWidth); 
d3.select("#test").attr("height", "100%"); 
</script>

演示：

http://www.frostjedi.com/terra/scripts/demo/fullsize-d3.html

這就像在div沒有被根本調整。

那麼，我該怎麼做，與D3，我在做什麼與jQuery？謝謝！

來源

2013-04-07 neubert

我應該看到黑屏嗎？這兩個腳本都不適合我用firefox 19 – dequis 2013-04-07 07:29:12

嗯 - 有趣。我正在使用Chrome。讓我弄清楚發生了什麼。 – neubert 2013-04-07 07:30:12

那麼現在jQuery的一個工作在Firefox。我用「100％」代替了$（window）.height（） – neubert 2013-04-07 07:33:39

jQuery的是設置CSS高度。你可以通過以下方法在d3中實現同樣的效果：

d3.select("#test").style("height", "100%");

來源

2013-04-07 07:36:42 minikomi

嗯，打我幾秒。原始代碼中的錯誤是他使用attr（）來設置html屬性而不是CSS。另外，window.innerHeight在這裏也可以正常工作。 – dequis 2013-04-07 07:40:13

如何使force佈局對象的高度達到100％？https://github.com/mbostock/d3/wiki/Force-Layout#wiki-size – neubert 2013-04-07 14:44:57

也許你可以使用CSS來做到這一點。在CSS文件：

#fullScreen{ 
    position:absolute; 
    left:0; 
    right:0; 
    top:0; 
    bottom:0; 
    background-color:#000; 
}

，並在HTML文件中：

<body> 
    <div id="fullScreen"></div> 
</body>

來源

2013-04-07 07:27:11

使用div填充整個屏幕

回答

相關問題