                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS动画效果

这个怎么不动的？

<!DOCTYPE html>

<html>

<head>

</head>

body{

margin:0;

padding:0;

}

.div1{

width:200px;

height:140px;

background-color: red;

left: -202px;

position: relative;

}

.div1 span{

width:20px;

height: 50px;

background: #eee;

position: absolute;

left: 200px;

top:75px;

}

</style>

<body>

</div>

window.onload = function(){

var wsc = document.getElementById('div1');

wsc.onmouseover = function(){

startMove();

}

function startMove(){

var wsc = document.getElementById('div1');

setInterval(function(){

wsc.style.left = wsc.offsetLeft+10+'px';

},30)

}

</script>

</body>

</html>

吴思超0

2015-12-10

源自：JS动画效果 2-1

关注问题我要回答

623

操作

收起

2 回答

李晓健
2015-12-10

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>练习JS</title>
</head>
<style type="text/css">
    body{
        margin:0;
        padding:0;
    }
    #div1{
        width:200px;
        height:140px;
        background-color: red;
        left: -202px;
        position: relative;
    }
    #div1 span{
        width:20px;
        height: 50px;
        background: #eee;
        position: absolute;
        left: 200px;
        top:75px;
    }
</style>
<body>
<div id="div1">
    <span id="share">分享</span>
</div>
<script>
    window.onload = function(){
        var wsc = document.getElementById('div1');
        wsc.onmouseover = function(){
            startMove();
        }
    }
    function startMove(){
        var wsc = document.getElementById('div1');
        setInterval(function(){
            wsc.style.left = wsc.offsetLeft+10+'px';
        },30)
    }
</script>
</body>
</html>

你上面写的class 你下面用getElementById 去取，肯定取不到呀