<!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>js簡單動(dòng)畫</title>
<style?type="text/css"?>
*{
margin:0;
padding:0;
}
#div1?{
width:200px;
height:200px;
background:purple;
position:relative;
left:-100px;
top:0;
}
#div1?span?{
width:20px;
height:50px;
background:skyblue;
position:absolute;
left:200px;
top:75px;
}
</style>
<script?type="text/jscript"?>
?window.onload()?=?function(){
?var?odiv?=?document.getElementById('div1');
?odiv.onmouseover?=?function(){
?startMove();
?}
?}
function?startMove(){
var?odiv?=?document.getElementById('div1');
setInterval(function(){
odiv.style.left?=?odiv.offsetLeft+10+'px';
},30);
}
</script>
</head>
<body>
<div?id="div1">
???????? <span?id="share">分享</span>
????????</div>
????
</body>
</html>
2016-07-11
32行,window.onload=function()...多了個(gè)括號