解决反复调用程序时变量的问题
1<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2<htmlxmlns="http://www.w3.org/1999/xhtml">
3<head>
4<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
5<title>移动对象</title>
6<scriptlanguage="javascript">
7functionmoveElement(elementID,finalX,finalY,interval){
8if(!document.getElementById)returnfalse;
9if(!document.getElementById(elementID))returnfalse;
10
11varelem=document.getElementById(elementID);
12
13if(elem.movement)//这里是重点，当元素的属性已经存在时就先清除计时器，否则无动作
14clearTimeout(elem.movement);
15
16varxpos=parseInt(elem.style.left);
17varypos=parseInt(elem.style.top);
18//alert(xpos);
19if(xpos==finalX&&ypos==finalY)
20returntrue;
21if(xpos<finalX)xpos++;
22if(xpos>finalX)xpos--;
23if(ypos<finalY)ypos++;
24if(ypos>finalY)ypos--;
25
26elem.style.left=xpos+"px";
27elem.style.top=ypos+"px";
28
29varrepeat="moveElement('"+elementID+"',"+finalX+","+finalY+","+interval+")";
30elem.movement=setTimeout(repeat,interval);
31}
32
33functionpositionMessage(msg,startPx,endPx,startPy,endPy,interval){
34if(!document.getElementById)returnfalse;
35if(!document.getElementById(msg))returnfalse;
36varelem=document.getElementById(msg);
37
38elem.style.position="absolute";
39elem.style.left=startPx+"px";
40elem.style.top=startPy+"px";
41//alert(elem.style.left);
42moveElement(msg,endPx,endPy,interval);
43}
44
45functionprepareSlideshow(){
46varpreview=document.getElementById("preview");
47preview.style.position="absolute";
48preview.style.left="0px";
49preview.style.top="0px";
50
51varlist=document.getElementById("linklist");
52varlinks=list.getElementsByTagName("a");
53links[0].onmouseover=function(){
54moveElement("preview",-100,0,10);
55}
56links[1].onmouseover=function(){
57moveElement("preview",-200,0,10);
58}
59links[2].onmouseover=function(){
60moveElement("preview",-300,0,10);
61}
62
63}
64</script>
65
66<styletype="text/css">
67#slideshow{
68width:500px;
69height:500px;
70position:relative;
71overflow:hidden;
72}
73</style>
74</head>
75
76<body>
77<pid="message">Message</p>
78<pid="message2">Message</p>
79<h1>WebDesign</h1>
80<p>Thesearethethingsyoushouldknow.</p>
81<olid="linklist">
82<li><ahref="a.html">aaaa</a></li>
83<li><ahref="b.html">bbbb</a></li>
84<li><ahref="c.html">cccc</a></li>
85</ol>
86<divid="slideshow">
87<imgsrc="images/1a.jpg"alt="something"id="preview"/>
88</div>
89
90<scriptlanguage="javascript">
91positionMessage("message",0,350,0,278,10);
92positionMessage("message2",50,315,50,361,10);
93prepareSlideshow();
94</script>
95</body>
96</html>
97因为如果用全局变量，反复触发一个事件的时候会出现速度加快的现象，所以把那个变量设置为被移动元素的属性就解决了这个问题
98 优质内容筛选与推荐>>
1、《TCP/IP具体解释卷2：实现》笔记--UDP：用户数据报协议
2、day 51 html 学习 js 学习
3、（六）6.9 Neurons Networks softmax regression
4、关于let以及var的区别
5、python_day14_函数_返回值_局部和全局变量