我的有问题啊 为什么

来源:2-1 JS速度动画

慕后端4326127

2016-05-20 10:55

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

<script type="text/javascript"></script>

*{margin:0; padding:0;}

#header{

width:200px;

height:200px;

background-color:red;

position:relative;

left:-200px;

}

#header span{

width:20px;

height:50px;

background-color:blue;

position:absolute;

left:200px;

top:75px;

}

</style>

<script>

   window.onload=function(){

  var Odiv=document.getElementById('header'); 

  Odiv.onmouseover=function(){

            startMove(0);

  }

  Odiv.onmouseout=function(){

  startMove(-200);

  }

  }

  

var timer=null;

function startMove(iTarget){

clearInterval(timer);

var Odiv=document.getElementById('header');

timer=setInterval(function(){

var speed=0;

if(Odiv.offsetLeft>iTarget){

speed=-10;

}

else{

speed=10;

}

if(Odiv.offsetLeft==-iTarget){

clearInterval(timer);

}

  else{

  Odiv.style.left=Odiv.offsetLeft+speed+'px';

     }

},30)

}

</script>


</head>

<body>

    <div id="header"> <span id="title">分享</span> </div>

   

   <!-- <div id="mainbody"></div>

    <div id="footer"></div>-->

</body>

</html>


写回答 关注

3回答

  • 跳动的音符
    2016-05-23 10:56:12

    你这地方 有两处错误

    574271470001483805000112.jpg

    574271480001e53b05000216.jpg


  • qq_南通印点_03295260
    2016-05-20 16:12:03

    恩?亲遇到什么问题了

  • qq_南通印点_03295260
    2016-05-20 14:49:29

    遇到什么问题了

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113924 学习 · 1443 问题

查看课程

相似问题