首页 web前端 js教程 JavaScript生成的动态下雨背景效果实现方法_javascript技巧

JavaScript生成的动态下雨背景效果实现方法_javascript技巧

May 16, 2016 pm 04:13 PM
javascript 下雨 动态 方法 生成 背景效果

本文实例讲述了JavaScript生成的动态下雨背景效果实现方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:


JavaScript生成的动态下雨背景效果



"); }
  else {
    document.write("
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\">");
    document.write(",.
");  }
}

function initRain() {
  a = 6;
  r[i] = 1;
  sn = Math.sin(a);
  cs = Math.cos(a);
  cx[i] = Math.random() * doc_width + 1;
  cy[i] = Math.random() * doc_height + 1;
  x[i] = r[i] * sn + cx[i];
  y[i] = cy[i];
}

function raindropIE() {
  for (i = 0; i      updateRain();
     if ((x[i] = (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
         makeRain();
         doc_width = document.body.clientWidth;
         doc_height = document.body.clientHeight; }
     document.all["dot"+i].style.pixelTop = y[i];
     document.all["dot"+i].style.pixelLeft = x[i]; }
  setTimeout("raindropIE()", speed);
}
function updateRain() {
  r[i] += 10;
  x[i] = r[i] * sn + cx[i];
  y[i] = r[i] * cs + cy[i];
}
function makeRain() {
  r[i] = 1;
  cx[i] = Math.random() * doc_width + 1;
  cy[i] = 1;
  x[i] = r[i] * sn + cx[i];
  y[i] = r[i] * cs + cy[i];
}
raindropIE();


希望本文所述对大家的javascript程序设计有所帮助。

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

怎么在番茄免费小说app中写小说 分享番茄小说写小说方法教程 怎么在番茄免费小说app中写小说 分享番茄小说写小说方法教程 Mar 28, 2024 pm 12:50 PM

怎么在番茄免费小说app中写小说 分享番茄小说写小说方法教程

七彩虹主板怎么进入bios?教你两种方法 七彩虹主板怎么进入bios?教你两种方法 Mar 13, 2024 pm 06:01 PM

七彩虹主板怎么进入bios?教你两种方法

微信删除的人如何找回(简单教程告诉你如何恢复被删除的联系人) 微信删除的人如何找回(简单教程告诉你如何恢复被删除的联系人) May 01, 2024 pm 12:01 PM

微信删除的人如何找回(简单教程告诉你如何恢复被删除的联系人)

将VirtualBox固定磁盘转换为动态磁盘,反之亦然 将VirtualBox固定磁盘转换为动态磁盘,反之亦然 Mar 25, 2024 am 09:36 AM

将VirtualBox固定磁盘转换为动态磁盘,反之亦然

Win11管理员权限获取方法汇总 Win11管理员权限获取方法汇总 Mar 09, 2024 am 08:45 AM

Win11管理员权限获取方法汇总

快速掌握:华为手机开启两个微信账号方法大揭秘! 快速掌握:华为手机开启两个微信账号方法大揭秘! Mar 23, 2024 am 10:42 AM

快速掌握:华为手机开启两个微信账号方法大揭秘!

手机版龙蛋孵化方法大揭秘(一步一步教你如何成功孵化手机版龙蛋) 手机版龙蛋孵化方法大揭秘(一步一步教你如何成功孵化手机版龙蛋) May 04, 2024 pm 06:01 PM

手机版龙蛋孵化方法大揭秘(一步一步教你如何成功孵化手机版龙蛋)

Oracle版本查询方法详解 Oracle版本查询方法详解 Mar 07, 2024 pm 09:21 PM

Oracle版本查询方法详解

See all articles