JS不能减小height到0

2010-11-29 08:24:13 108 阅读 AI 写同款 · GEO 优化AI 选题数据监测一键分发 ›

工业自动化实战：用LabVIEW的DSC模块实现MODBUS-TCP设备控制本文详细介绍了如何利用LabVIEW的DSC模块实现工业自动化中的MODBUS-TCP设备控制。通过环境准备、核心功能解析、状态机实现及典型工业场景实战，帮助工程师快速掌握稳定可靠的通讯技术，提升工业自动化系统的运行效率。阅读详情

我想写个特效，用JS控制 DIV 的 width 、height属性，但是发现最后 height alert出来已经减小到0了，页面还有一段，看着很不爽，目前效果如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>MyHtml.html</title>

<style type="text/css">

#btnDiv{
position: absolute;
top: 400px;
left: 600px;
}

#main{
position: absolute;
top: 100px;
left: 600px;

}

</style>

<script type="text/javascript">

function small(){
//隐藏当前层
var objDiv = document.getElementById("main");
objDiv.style.display = "none";
//创建特效层
var newDiv = document.createElement("div");
newDiv.setAttribute("id","newDIV");
//newDiv.innerHTML = "abc";
newDiv.style.position = "absolute";
newDiv.style.top = "100px";
newDiv.style.left = "600px";
newDiv.style.width = "300px";
newDiv.style.height = "180px";
newDiv.style.border = "1px dashed black";
document.body.appendChild(newDiv);
//特效
effectSmall();
}

function effectSmall(){
var newDiv = document.getElementById("newDIV");
//alert(parseInt(newDiv.style.width)); //300

if(parseInt(newDiv.style.width) > 0){
var tempWidth = 0;
if(parseInt(newDiv.style.width) >= 5){
tempWidth = parseInt(newDiv.style.width) - 5;
}else{
tempWidth = 0;
}
newDiv.style.width = tempWidth + 'px';

var tempHeight = 0;
if(parseInt(newDiv.style.height) >= 3){
tempHeight = parseInt(newDiv.style.height) - 3;
}else{
tempHeight = 0;
}
newDiv.style.height = tempHeight + 'px';

timer = setTimeout('effectSmall()',10);
}else{
newDiv.style.display = "none";
}
if(parseInt(newDiv.style.height) < 30){
alert(parseInt(parseInt(newDiv.style.width) + "\t" + newDiv.style.height));
}
}

function big(){

clearTimeout(timer);

var objDiv = document.getElementById("main");
objDiv.style.display = "block";

var newDiv = document.getElementById("newDIV");
document.body.removeChild(newDiv);

}

</script>

</head>

<body>

<div id="main">
<table border="1px solid #345323" style="width: 300px; height: 180px;">
<tr><td align="center">top: 100px；left: 600px;</td></tr>
<tr><td align="center">222</td></tr>
<tr><td align="center">333</td></tr>
</table>
</div>

<div id="btnDiv">
<input type="button" value="缩小" onclick="small()" />
<input type="button" value="放大" onclick="big()" />
</div>

</body>
</html>

郁闷的是，后来发现在FF没问题，IE下始终有段height，很不爽，望高手帮下忙，怎么才有FF的效果

...全文