根据视口高度动态设置DIV高度

我正在尝试将div的高度设置为视口高度的30％，我非常希望在视口高度发生变化时进行缩放。

我尝试设置最小高度：30％; 身高：30％但是不起作用。

我看了一下JQuery的高度（）; 但我只是不知道如何开始。

谢谢。

Answer 1

function thirty_pc() { var height = $(window).height(); var thirtypc = (30 * height) / 100; thirtypc = parseInt(thirtypc) + 'px'; $("div").css('height',thirtypc); } $(document).ready(function() { thirty_pc(); $(window).bind('resize', thirty_pc); }); 

Answer 2

这基本上是Liam Bailey的答案，但是有一个更快更简洁的30._pc（）：

 function thirty_pc() { $("div").css('height', '' + Math.round(.3 * window.height())); } $(document).ready(function() { thirty_pc(); $(window).bind('resize', thirty_pc); }); 

如果你喜欢它，请仍然接受Liam’s，但是请求我的。 🙂

Answer 3

 window.onresize=function(){ $("#selectedDiv").height( ($(window).height()*.3) ); } 

Answer 4

这个100％用于任何div的视口高度，使用Jquery具有此类的部分。 使用附加function将高度调整为30％目前为100％如果您喜欢，请升级。

 function thirty_pc() { $(".introduction").css({'height':($(window).height())+'px'}); } $(document).ready(function() { thirty_pc(); $(window).bind('resize', thirty_pc); });