本站源码全部测试通过,配有前台及后台演示图,绿色安全,希望能对大家有所帮助!
  • 首 页
  • VPS/云主机
  • jQuery天空满天星背景动画特效
    时间:2019-12-29 13:01 来源:开源之家 作者:开源之家测试提供 下载:96 次
    • 源码说明:本站源码全部经过测试,配有前台及后台管理界面演示图,去除后门,绿色安全,希望对大家学习研究能有所帮助!
    • 源码类型:特效源码
    • 源码大小:33.3 KB
    • 运行环境:HTML
    • 下载次数:96 次
    • 推荐VPS:
    • 提取密码/源码编号:
    • 本地下载
    • 本地下载
    • 》网盘下载,每日更新

    jQuery天空满天星背景动画特效

    特效描述:jQuery 天空满天星 背景动画特效,jQuery天空满天星背景动画特效

    代码结构

    1. 引入JS

    1
    <script src="js/jquery.min.js"></script>

    2. HTML代码

    <div id="starsBox"></div>
    <p>布满星星的天空</p>
    <script type="text/javascript">
    var cols = ['#f5d76e','#f7ca18','#f4d03f','#ececec','#ecf0f1','#a2ded0'];
    var stars = 250;
    for (var i = 0; i <= stars; i++) {
        var size = Math.random()*3;
      var color = cols[parseInt(Math.random()*4)];
        $('#starsBox').prepend('<span style=" width: ' + size + 'px; height: ' + size + 'px; top: ' + Math.random()*100 + '%; left: ' + Math.random()*100 + '%; background: ' + color + '; box-shadow: 0 0 '+ Math.random()*10 +'px' + color + ';"></span>') ;
    };
    setTimeout(function(){ 
        $('#starsBox span').each(function(){  
            $(this).css('top', Math.random()*100 + '%').css('left', Math.random()*100 + '%'); 
      });
    }, 1);
    setInterval(function(){ 
        $('#starsBox span').each(function(){    
            $(this).css('top', Math.random()*100 + '%').css('left', Math.random()*100 + '%'); 
      });
    }, 100000);
    </script>

    jQuery天空满天星背景动画特效

    郑重声明:
    本站资源均由高价购买、会员分享,全部经过测试,配有前台及后台管理界面演示图,去除后门,绿色安全,希望对大家学习研究能有所帮助!
    若您需要商业运营或用于其它商业活动,请您购买正版授权并合法使用。 我们不承担任何技术及版权问题,且不对任何资源负法律责任。
    如无法下载,联系站长索要。如有侵犯您的版权,请提交软件证书/图片地址和源码链接 我们尽快处理。

    开源之家广告栏目A
    开源之家广告栏目B
    开源之家广告栏目C
    在线客服
    客服微信

    扫一扫......加客服微信