<style>
*{ margin: 0; padding: 0;}
#ul1{
width: 400px;
height: 400px;
border: 1px solid #000;
margin: 10px auto;
padding: 4px;
overflow: hidden;
}
/* #ul li 选择器写错了！！！ */
#ul1 li{
border-bottom: 1px #999 dashed;
padding: 4px;
list-style: none;
overflow: hidden;
filter:alpha(opacity=0);
opacity: 0;
/* border-bottom: 1px dashed; border没有设置颜色！！！ */
/* filter: alpha = 0; 格式错误！！ */
}
</style>
<script src="move2.js"></script>
<script>
window.onload = function()
{
var oTxt = document.getElementById('txt1');
var oBtn = document.getElementById('btn1');
var oUl = document.getElementById('ul1');
oBtn.onclick = function()
{
var oLi = document.createElement('li');
oLi.innerHTML = oTxt.value;
oTxt.value = '';
if(oUl.children.length>0)
{
// oUl.insertBefore(oLi, oUl.childNodes[0])
// 注意childNodes 和 children的区别
oUl.insertBefore(oLi, oUl.children[0]);
}
else
{
oUl.appendChild(oLi); // 添加的子节点值是不是这样写的？
};
var iHeight = oLi.offsetHeight;
oLi.style.height = '0';
startMove(oLi, {height: iHeight}, function()
{
startMove(oLi, {opacity: 100})
});
};
};
</script>
</head>
<body>
<textarea id="txt1" cols="30" rows="4"></textarea>
<input type="button" value="发布" id="btn1">
<ul id="ul1"></ul>
</body>
