div定时放大缩小 

<!DOCTYPE html>
<html>
<head>
<style> 
.anim{
    width: 100px;
    height: 100px;
    background-color: red;
}
.anim-show
{
    transition: 0.7s;
    transform:translate(100px,100px) scale(1.5);
}
.anim-show1
{
    transition: 0.7s;
    transform:translate(100px,100px) scale(1);
}

</style>
</head>
<body>
    <div id="a" class="anim anim-show1"></div>
    
    <script src="http://www.jq22.com/jquery/2.1.1/jquery.min.js"></script>
    <script>


        var i = 0;

        var int=self.setInterval("clock()",700);
        
        function clock(){
            i++;

            if(parseInt(i/2) == i/2){
                $("#a").addClass("anim-show");
                $("#a").removeClass("anim-show1");
            }else{
                $("#a").removeClass("anim-show");
                $("#a").addClass("anim-show1");
            }
        }
    </script>
</body>
</html>

 

posted @ 2019-08-09 16:29  钧一  阅读(715)  评论(0)    收藏  举报