js 的一个问题 路过的大侠帮忙看下 为什么？谢谢-- 没什么豆
0
悬赏园豆：5
[已关闭问题]
解决于 2013-03-06 17:15
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
div
{
width: 200px;
height: auto;
overflow: hidden;
margin: 0 auto;
line-height: 24px;
font-size: 12px;
margin-top: 100px;
border: 1px solid #3366cc;
}
div ul
{
overflow: hidden;
zoom: 1;
}
</style>
</head>
<body>
<div>
<ul><li>今天我们要去浑南游玩</li></ul>
</div>
<script type="text/javascript">
(function () {
var div = document.getElementsByTagName('div')[0];
var ul = div.getElementsByTagName('ul')[0];
ul.style.margin = 0 + 'px';
div.style.height = ul.offsetHeight + 'px';
var li_h = ul.getElementsByTagName('li')[0].offsetHeight;
ul.innerHTML += ul.innerHTML;
ul.outerTime = setInterval(function () {
var ypos = parseInt(ul.style.marginTop);
var final_y = ypos - li_h;
if (final_y <= -ul.offsetHeight / 2) {
ul.style.marginTop = 0 + 'px';
final_y = -li_h;
}
move(ul, final_y);
}, 3000)
})();
function move(obj, final_y) {
var ypos = parseInt(obj.style.marginTop);
if (ypos > final_y) {
var dist = 0;
dist = Math.ceil(-(final_y - ypos) / 10);
ypos = ypos - dist;
obj.style.marginTop = ypos + 'px';
//obj.innerTime = setTimeout(move(obj, final_y), 50); //自己move调用自己不可以
//obj.innerTime = setTimeout(arguments.callee(obj, final_y)); //利用js内置的callee调用自己也不行
obj.innerTime = setTimeout(function () { move(obj, final_y) }, 50);//匿名函数调用就可以 前面2个为什么不可以？
} else {
clearTimeout(obj.innerTime);
}
}
</script>
</body>
</html>
看代码 函数move 下面红色的注释(有3个，前面2个效果没实现)不知道为什么？但是我调式打断点了js 我发现那个div里面ul 确实移动了 只是直接肉眼无法看到 而第3个就可以。不明白为什么？
我 调式这段代码发现移动这个div里面的ui的文字的思路就是改变css 本人css不怎么好 也希望解释下 操作css改变动画 的原理 怎么动起来的 谢谢！
