有意思的效果——摇曳的萤火虫

最新推荐文章于 2023-06-05 22:59:38 发布

a23180012142

最新推荐文章于 2023-06-05 22:59:38 发布

阅读量152

点赞数

原文链接：http://www.cnblogs.com/thestudy/p/6285367.html

版权

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            img{border: 0;position:absolute;width: 20px;height: 20px;}
            body{background: url(img/img/bg.jpg);}
        </style>
    </head>
    <script src="js/jquery-1.11.3.js"></script>
    <script>

    
        $(function(){
            var count=100;
            var aa=document.getElementById("a")
    for(var j=0;j<count;j++){
                var img=document.createElement("img")
                img.src="img/img/1.jpg" 
                aa.appendChild(img)
            }
                a=Math.random()*1500
                b=Math.random()*700
            $("img").css({left:a,top:b})
                    
                $("img").animate({left:Math.random()*300,top:Math.random()*300},1000,function(){
                    var timmer=setInterval(function(){
                        for(var i=0;i<count;i++){
                            c=Math.random()*1200
                            d=Math.random()*650
                            sp=Math.random()*2000+2000
                            $("img").eq(i).animate({left:c,top:d},sp)
                            
                        }
                    
                },5000)
                    
                })
        })

    </script>
    <body>
    <div id="a"></div>
    
                                    
        
    
    </body>
</html>

转载于:https://www.cnblogs.com/thestudy/p/6285367.html

a23180012142

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
有意思的效果——摇曳的萤火虫

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> img{border: 0;position:absol...
复制链接

扫一扫