<!doctype?html>
<html>
?<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
??<title>滑出導航欄</title>
??<style>
body,div,span{
????margin:?0;
????padding:?0;
}
#div1{
????width:?200px;
????height:?200px;
????background:?red;
????position:?relative;
????left:-200px;
????top:200px;
}
#div1?span{
????????width:?20px;
????????height:?50px;
????????background:?blue;
????????position:?absolute;
????????left:?200px;
????????top:75px;
????}
??</style>
?
??<script>
????window.onload=function(){
????????var?v=document.getELementById("div1");
????????v.onmouseover=function(){
????????????star();
????????v.onmouseout=function(){
????????????star1();
????????}????
????????}
????}
????????var?timer=null;
????function?star(){
????????clearInterval(timer);
????????var?v=document.getELementById("div1");
????????timer=setInterval(function(){
????????????if(v.offsetLeft==0){
????????????????clearInterval(timer);
????????????}
????????????else{
????????????????v.style.left=v.offsetLeft+10+"px";
????????????}
????????},30)
????}
????function?star1(){
????????clearInterval(timer);
????????var?v=document.getELementById("div1");
????????timer=setInterval(function(){
????????????if(v.offsetLeft==-200){
????????????????clearInterval(timer);
????????????}
????????????else{
????????????????v.style.left=v.offsetLeft-10+"px";
????????????}
????????},30)
????}
</script>??
??<body>
<div?id="div1">
<span?id="share">分享</span>
</div>
??</body>
??</html>
各位大神幫看看哪里有問題，找半天找不見！鼠標觸碰滑塊滑出
名字只是個代號丶
2016-08-02 19:25:45
