js笔记：setInterval和clearInterval

4th 7月 2008, 12:31 下午
  1. function moveDiv(divName){
  2.                 var name = document.getElementsByTagName(divName);
  3.                 var maxLength = 300;
  4.                 var left,top,t,bb,n;
  5.                 for(var i = 0;i < name.length;i++){
  6.                     if(name[i].className == "c"){
  7.                         name[i].onclick = function(event){
  8.                             if(!event){
  9.                                 event = window.event;
  10.                             }                           
  11.                             var el = event.target || event.srcElement;
  12.                             n = el.offsetWidth;
  13.                             if(n>=maxLength)return;
  14.                             bb = setInterval(
  15.                                 function(){
  16.                                     if(n < maxLength){
  17.                                         el.style.width = n + "px";
  18.                                         el.style.height = n + "px";
  19.                                         el.style.top = el.offsetTop - 5 + "px";
  20.                                         el.style.left = el.offsetLeft - 5 + "px";
  21.                                         n = n + 10;
  22.                                     } else {
  23.                                         el.style.width = maxLength + "px";
  24.                                         el.style.height = maxLength + "px";
  25.                                         el.style.top = el.offsetTop - (n-maxLength)/2 + "px";
  26.                                         el.style.left = el.offsetLeft - (n-maxLength)/2 + "px";
  27.                                         window.clearInterval(bb);
  28.                                     }
  29.                                 },30
  30.                             );
  31.                         };
  32.                     }
  33.                 }
  34.             }
  35.             window.onload = function(){
  36.                 moveDiv("div");
  37.             };
分类： js笔记  |  评论

js学习笔记：setInterval()的进一步理解

2nd 7月 2008, 05:46 下午
  1. <head>
  2.         <style type="text/css">
  3.         #s{border:1px solid #000;width:100px;height:100px;top:300px;left:300px;cursor:pointer;}
  4.         </style>
  5.     </head>
  6.     <body>
  7.         <script type="text/javascript">
  8.             function test(o){
  9.                 var i = 1;
  10.                 if(typeof o == "string"){
  11.                     var j = 2;
  12.                     for(var k = 0;k < 10;k++){
  13.                         alert(k);
  14.                     }
  15.                     alert(k);
  16.                 }
  17.                 alert(j);
  18.             }
  19.             function f(){
  20.                 var sa = document.getElementsByTagName("a");
  21.                 for(var i = 0;i < sa.length;i++){
  22.                     sa[i].onclick = function(){alert(this.innerHTML)};
  23.                 }
  24.             }
  25.             function printDate(){
  26.                 var d = new Date();
  27.                 var s = document.getElementById("s");
  28.                 s.innerHTML = d.toLocaleString();
  29.             }
  30.             function moveDiv(divName){
  31.                     var name = document.getElementById(divName);
  32.                     name.style.position = "absolute";
  33.                     var n = name.offsetWidth;;
  34.                     function change(){
  35.                         if(n<290){
  36.                             name.style.width = n + "px";
  37.                             name.style.height = n + "px";
  38.                             name.style.top = 300- n/3 + "px";
  39.                             name.style.left = 300 - n/3 + "px";
  40.                             n = n+10;
  41.                         }
  42.                     }
  43.                     function small(){
  44.                         if(n>110){
  45.                             name.style.width = n + "px";
  46.                             name.style.height = n + "px";
  47.                             name.style.top = 300- n/3 + "px";
  48.                             name.style.left = 300 - n/3 + "px";
  49.                             n = n-10;
  50.                         }
  51.                     }
  52.                     if(name.className == "c"){
  53.                         name.onclick = function(){
  54.                             name.className = "d";
  55.                             setInterval(change,10);
  56.                         };
  57.                     }
  58.                     else{
  59.                         name.onclick = function(){
  60.                             name.className = "c";
  61.                             setInterval(small,10);
  62.                         };
  63.                     }
  64.                 }
  65.             window.onload = function(){
  66.                 f();
  67.                 moveDiv("s");
  68.             };
  69.         </script>
  70.         <div id="s" class="c">dd</div>
  71.         <a id="sd" href="#nogo">click here</a>
  72.         <a href="#nogo">click here too</a>
  73.     </body>
分类： js笔记  |  评论