为<div>设置固定的高度和宽度
为<div>设置固定的高度和宽度
提问于 2013-01-31 14:45:09
function scrollfun()
{
var ob = document.getElementById('rowScroll');
ob.style.height ="300px";
ob.style.width = "200px";
}这里的rowScroll是<div> id。上面的代码工作正常。但以下代码不起作用：
function scrollfun()
{
var ob = document.getElementById('rowScroll');
ob.style.height ="30%";
ob.style.width = "20%";
}我怎样才能让它与百分比一起工作呢？
回答 4
Stack Overflow用户
发布于 2013-01-31 15:09:02
您将需要使用div标记来实现这一点。请看下面的工作代码：
<!DOCTYPE html>
<html>
<head>
<script>
function displayResult()
{
document.getElementById("b1").style.height="200%";
}
</script>
</head>
<body>
<div style="height:25px;">
<input type="button" id="b1" onclick="displayResult()" value="Change height of button" >
</body>
</html>Stack Overflow用户
发布于 2013-01-31 15:09:10
如果你告诉它这些百分比是从哪里来的呢？喜欢
function scrollfun()
{
var ob = document.getElementById('rowScroll');
ob.style.height = (container-width * 30)/100 + "px"
ob.style.width = (container-width * 20)/100 + "px"
}Stack Overflow用户
发布于 2013-01-31 15:11:17
仅供参考，基于百分比的宽度高度取决于元素“rowScroll”的父容器。尝试将高度、宽度信息提供给父对象本身...
更新：
对于高度宽度为屏幕宽度50%的屏幕，如下所示：
function windowHW() {
var myWidth = 0, myHeight = 0;
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;
}
return [myHeight,myWidth];
}
function scrollfun()
{
var ob = document.getElementById('rowScroll');
document_dimension = windowHW();
ob.style.height =document_dimension[0]/2;
ob.style.width =document_dimension[1]/2;
}请注意，函数windowHW是对中给出的解决方案的细微修改：
由meder应答的stackoverflow question: JavaScript - Get Browser Height
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14619953
复制相关文章
相似问题
腾讯云开发者
