為什么我的moveout函數(shù)沒有實(shí)現(xiàn)呢
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js動(dòng)畫框架1</title>
<style type="text/css">
span {}
.big {
height: 100px;
width: 200px;
background-color: red;
position: absolute;
left: -200px;
}
.share {
height: 50px;
width: 20px;
background-color: deepskyblue;
margin-left: 200px;
display: block;
font-family: "微軟雅黑";
padding: 5px;
}
</style>
</head>
<body>
<div class="big" id="big"><span class="share">分享</span></div>
<script type="text/javascript">
window.onload = function() {
var mdiv = document.getElementById("big");
mdiv.onmouseover = function() {
startmove(mdiv,0);
}
mdiv.onmouseout = function() {
startmove(mdiv,-100);
}
}
var timer = null;
function startmove(div,its) {
clearInterval(timer);
// var mdiv = document.getElementById(div);
timer = setInterval(function() {
var speed = 0;
if (div.OffsetLeft > its) {
speed = -10;
} else {
speed = 10;
}
if (div.offsetLeft == its) {
clearInterval(timer);
} else {
div.style.left = div.offsetLeft + speed + 'px';
}
}, 30)
}
</script>
</body>
</html>
2016-07-12
if?(div.OffsetLeft?>?its)?{ speed?=?-10; }?else?{ speed?=?10; }這一句的offsetLeft被你寫成了OffsetLeft.o應(yīng)該是小寫的.
還有運(yùn)行之后會(huì)發(fā)現(xiàn)div在鼠標(biāo)移開后收進(jìn)去到一半會(huì)被卡住,因?yàn)槟愕膇ts應(yīng)該是-200而不是-100.
2016-07-12
if (div.OffsetLeft > its) {
speed = -10;
} else {
speed = 10;
}
OffsetLeft ?把o改成小寫