摘要:JavaScript:漸層新增Div與縮放Div高度
<html>
<head>
<title></title>
</head>
<body>
<div style="background-color:#000000;height:1px;line-height:1px;overflow:hidden;width:100%">
</div>
<div id='content' width="100%;" style='border:1 solid #0000FF;'>
</div>
<script language='javascript' >
function AddDiv()
{
var i ;
var obj = document.getElementById('content');
var strhtml;
for(i=1;i<=50;i++)
{
strhtml = "<div style='background-color:#000000;height:"+i+";overflow:hidden;width:100%;border:0.5pt solid #00FFFF'></div>";
obj.innerHTML += strhtml;
}
}
function ChangeSize()
{
var obj = document.getElementById('size_text');
var objContent = document.getElementById('content');
objContent.style.height = obj.value;
objContent.style.overflow="hidden";
}
</script>
<button onclick='AddDiv();return false;'>AddDIV</button>
<input id='size_text' value='0' /><button onclick='ChangeSize()'>縮放</button>
</body>
</html>