JavaScript Timer实现代码(2)


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-31j">
<title>Insert title here</title>
<style type="text/css">
.rowLine {
width: 400px;
height: 80px;
border-bottom-style: solid;
border-width: 1px;
}
.barList {
border-style: solid;
border-width: 1px;
width:400px;
height: 80px;
overflow: hidden;
}
</style>
<script type="text/javascript" src="https://www.jb51.net/js/timer2.src.js"></script>
<script type="text/javascript">
<!--
var timer = new Timer(50);
var globalTimer = new Timer(10000);
var bList;
function init() {
bList = document.getElementById("barList");
timer.addEventListener(TimerEvent.TIMER, calTime);
timer.start();
globalTimer.addEventListener(TimerEvent.TIMER, controlTime);
globalTimer.start();
}
function controlTime() {
if (!timer.running) {
timer.reset();
timer.start();
}
}
function calTime() {
bList.scrollTop += 1;
if (bList.scrollTop > 80) {
timer.stop();
var barNode = bList.firstChild;
if (barNode.nodeType == 3) {
bList.appendChild(barNode);
bList.appendChild(bList.getElementsByTagName("div")[0]);
} else {
bList.appendChild(barNode);
}
bList.scrollTop = 0;
}
}
window.onload = init;
// -->
</script>
</head>
<body>
<div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
</body>
</html>


addEventListener的useCapture参数本为捕获阶段触发之意,现在改成如果true,则在其他句柄之前触发,如果false,则在其他句柄之后触发。
后记:
现在貌似大家比较流行评论说明书的用法。。。比如struts+spring+hibernate。而忽略了编程的实质。希望大家多看源码,多讨论源码,那样才会有所谓的思想。否则人家今天用这个framework,明天换了。你又要从头开始了。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdsssg.html