美丽的杭州

.黑色HTML5飘雪登录界面模板下载

系统分类: 网页特效 - html5 - html5模板 2015-04-23

人气19168

亲们该页面内会员们分享的“作品”,版权为才华横溢的原作者们所有滴,不得商业使用!

  • 登录界面,背景是飘雪效果
  • 注册页面,关闭的注册的时候动画效果很棒


黑色HTML5用户登录界面模板,按注册可以弹出注册框,还可以通过back隐藏注册框,动态提交内容,建议使用js进行数据处理。白色的点为飘落的雪花用HTML5的canvas做的。以下为飘雪的js代码:

<script type="text/javascript">
     var snow = function() {
    if(1==1) {
      $("body").append('<canvas id="christmasCanvas" style="top: 0px; left: 0px; z-index: 5000; position: fixed; pointer-events: none;"></canvas>');
      var b = document.getElementById("christmasCanvas"), a = b.getContext("2d"), d = window.innerWidth, c = window.innerHeight;
      b.width = d;
      b.height = c;
      for(var e = [], b = 0;b < 70;b++) {
        e.push({x:Math.random() * d, y:Math.random() * c, r:Math.random() * 4 + 1, d:Math.random() * 70})
      }
      var h = 0;
      window.intervral4Christmas = setInterval(function() {
        a.clearRect(0, 0, d, c);
        a.fillStyle = "rgba(255, 255, 255, 0.6)";
        a.shadowBlur = 5;
        a.shadowColor = "rgba(255, 255, 255, 0.9)";
        a.beginPath();
        for(var b = 0;b < 70;b++) {
          var f = e[b];
          a.moveTo(f.x, f.y);
          a.arc(f.x, f.y, f.r, 0, Math.PI * 2, !0)
        }
        a.fill();
        h += 0.01;
        for(b = 0;b < 70;b++) {
          if(f = e[b], f.y += Math.cos(h + f.d) + 1 + 
          f.r / 2, f.x += Math.sin(h) * 2, f.x > d + 5 || f.x < -5 || f.y > c) 
          {
            e[b] = b % 3 > 0 ? 
            {x:Math.random() * d, y:-10, r:f.r, d:f.d} : Math.sin(h) > 0 ? 
            {x:-5, y:Math.random() * c, r:f.r, d:f.d} : 
            {x:d + 5, y:Math.random() * c, r:f.r, d:f.d}
          }
        }
      }, 70)
    }
  }
  snow();
</script>


查看演示
下载资源:47
下载资源
错误提交:

格式:rar 大小:34.33KB

================关于优设记================
“优设记ui3g.com“是国内最全jquery插件下载 - 高质量网页素材的学习下载平台
资源微博:同步网站更新内容,订阅jquery资源 @吐槽优设记,欢迎关注获取网页设计资源、下载顶尖设计素材。
文章链接: http://www.ui3g.com/code/uicode-1339.html 非特殊说明,本文版权归原作者所有,转载请注明出处
.黑色HTML5飘雪登录界面模板下载

我当前G币余额:0 已下载次数:47

注:购买该插件的用户当日可免费下载 插件作者可永久免费下载

所需G币:20

下载提示:由于文件较小,请直接点击下载,不支持迅雷等下载工具。

抱歉 G币 不足,你可以通过 上传PSD & jquery 充值 获得G币

据说认真评论作品的以后都迅速成长为大神了(已有7 评论)