GitHub 博客园 Nanakon

【模块】滚屏 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<style type="text/css">
#marquee{ width:160px; height:60px; overflow:hidden; border:1px solid #DDD3FE; background:#eeecf4;}
#marquee div{ height:60px;}
</style>
<div id="marquee">
    <div>one</div>
    <div>two</div>
    <div>three</div>
</div>
<script>
var mar = document.getElementById("marquee");
var child_div = mar.getElementsByTagName("div");
var picH = 60;
var scrollstep=3;
var scrolltime=20;
var stoptime=3000;
var tmpH = 0;
function start () {
    if (tmpH < picH) {
        tmpH += scrollstep;
        mar.scrollTop = tmpH;
        setTimeout(start, scrolltime);
    } else {
        tmpH = 0;
        mar.appendChild(child_div[0]);
        mar.scrollTop = 0;
        setTimeout(start, stoptime);
    }
}
window.onload = function () {
    setTimeout(start, stoptime);
}
</script>
</body>
</html>

posted on 2012-06-29 09:40  jzm17173  阅读(122)  评论(0)    收藏  举报

导航

轻音