js 側邊欄
阿新 • • 發佈：2018-12-19
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="jquery-1.4.2.js"></script> <style type="text/css"> body{margin:0; padding:0;} .lefta{ width: 200px; height: 200px; background:red; position: relative; float: left; left:-200px;} .lefta .aa{ width: 30px; height: 30px; background:orange; position: absolute; right: -30px; top: 50%;} </style> <script type="text/javascript"> window.onload=function(){ var oDiv=document.getElementById("stx"); oDiv.onmouseover=function(){ starAin(0); } oDiv.onmouseout=function(){ starAin(-200); } } var Time=null; function starAin(istga){ clearInterval(Time); var oDiv=document.getElementById("stx"); Time=setInterval(function(){ var spint=0; if(oDiv.offsetLeft>istga){ spint=-10; }else{ spint=10; } if(oDiv.offsetLeft==istga){ clearInterval(Time) }else{ oDiv.style.left=oDiv.offsetLeft+spint+'px'; } },30) } </script> </head> <body> <div id="stx" class="lefta"> <a id="animat" href="javascript:;" class="aa">11</a> </div> </body> </html>