html网页中表格自动向下展开的代码

把一下代码直接新建HTML保存，你看下效果。刚写的，有问题再联系我。

<div id="iddiv" style="width:200pxheight:200pxoverflow:hiddenborder: 1px solid blue">

<table >

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

<tr><td>12</td><td>12</td><td>12</td></tr>

</table>

</div>

asdfaf

<script type="text/javascript">

var id = setTimeout("fnGo()",2000)

function fnGo(){

var div = document.getElementById("iddiv")

div.style.height = parseFloat(div.style.height) + 1

if( parseFloat(div.style.height) >= 1000){

clearTimeout(id)

}else{

id = setTimeout("fnGo()",50)

}

}

</script>

在外面加个div就可以了，然后用css控制这个div:

<div style="display:blockposition:absolute z-index:999 right:0 bottom:0">

  <!--你的表格-->

  <table style="width:200pxheight:200px" border="1">

      <tr><td>1</td><td>2</td><td>3</td></tr>

      <tr><td>1</td><td>2</td><td>3</td></tr>

  </table>

</div>

效果：

可以用css3的box-shadow属性。

举个例子

table{

box-shadow: 10px 10px 5px #888888// (水平阴影的位置 垂直阴影的位置 模糊距离 阴影的颜色)

}

注意兼容性~他还可以进行叠加，产出更加惊艳的效果~~

---