"
Team:UCLA/anuved verma ucla2014 workspace
From 2014.igem.org
(Difference between revisions)
Anuvedverma (Talk | contribs) |
Anuvedverma (Talk | contribs) |
||
| Line 1: | Line 1: | ||
{{:Team:UCLA/Template}} | {{:Team:UCLA/Template}} | ||
| - | {{ | + | {{CSS/Main}} |
| Line 11: | Line 11: | ||
<div id="box" style="width: 200px; height: 200px; background: red;"></div> | <div id="box" style="width: 200px; height: 200px; background: red;"></div> | ||
| - | <script type="text/javascript" | + | <script type="text/javascript" charset="utf-8"> |
| - | + | function addEvent(obj,evt,fn,capture){ | |
| - | function addEvent(obj,evt,fn,capture){ evt=evt.replace('on',); if(obj.attachEvent) obj.attachEvent('on'+ evt,fn); else{ if(!capture) capture=false; obj.addEventListener(evt,fn,capture); } } function moveDiv(obj,distance,speed){ if(!distance) distance=250; if(!speed) speed=500; if(!obj.style.marginLeft) obj.style.marginLeft=0+'px'; var timer=null, startTime=(new Date).getTime(), elapsed=null, d=null, dir='right', current_distance=obj.style.marginLeft.replace('px',); if(distance<current_distance) dir='left'; timer=setInterval(function(){ elapsed=(new Date).getTime()- startTime; if(elapsed<speed){ if(dir=='right'){ d=elapsed/speed*distance; obj.style.marginLeft=d+'px'; } else{ d=elapsed/speed*distance; d=current_distance- d; obj.style.marginLeft=d+'px'; } } else{ clearInterval(timer); obj.style.marginLeft=distance+'px'; } },5); } var box = document.getElementById('box'); addEvent(box, 'click', function(){ moveDiv(box,250,1000); })</script> | + | evt=evt.replace('on',''); |
| + | if(obj.attachEvent) obj.attachEvent('on'+ evt,fn); | ||
| + | else{ | ||
| + | if(!capture) | ||
| + | capture=false; | ||
| + | obj.addEventListener(evt,fn,capture); | ||
| + | } | ||
| + | } | ||
| + | function moveDiv(obj,distance,speed){ | ||
| + | if(!distance) | ||
| + | distance=250; | ||
| + | if(!speed) | ||
| + | speed=500; | ||
| + | if(!obj.style.marginLeft) | ||
| + | obj.style.marginLeft=0+'px'; | ||
| + | var timer=null, | ||
| + | startTime=(new Date).getTime(), | ||
| + | elapsed=null, | ||
| + | d=null, | ||
| + | dir='right', | ||
| + | current_distance=obj.style.marginLeft.replace('px',''); | ||
| + | if(distance<current_distance) | ||
| + | dir='left'; | ||
| + | timer=setInterval(function(){ | ||
| + | elapsed=(new Date).getTime()- startTime; | ||
| + | if(elapsed<speed){ | ||
| + | if(dir=='right'){ | ||
| + | d=elapsed/speed*distance; | ||
| + | obj.style.marginLeft=d+'px'; | ||
| + | } | ||
| + | else{ | ||
| + | d=elapsed/speed*distance; | ||
| + | d=current_distance- d; | ||
| + | obj.style.marginLeft=d+'px'; | ||
| + | } | ||
| + | } | ||
| + | else{ | ||
| + | clearInterval(timer); | ||
| + | obj.style.marginLeft=distance+'px'; | ||
| + | } | ||
| + | },5); | ||
| + | } | ||
| + | var box = document.getElementById('box'); | ||
| + | addEvent(box, 'click', function(){ | ||
| + | moveDiv(box,250,1000); | ||
| + | }) | ||
| + | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
Revision as of 04:04, 16 July 2014
