当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 使主页呈现“飞舞”特效

Javascript
javascript 响应键盘特定按键(只响应数字键)
javascript indexOf方法、lastIndexOf 方法和substring 方法
javascript parseInt 函数分析(转)
javascript Split方法,indexOf方法、lastIndexOf 方法和substring 方法
JavaScript 面向对象入门精简篇
JS中==与===操作符的比较
JavaScript indexOf忽略大小写
dwr spring的集成实现代码
DWR Ext 加载数据
JavaScript 计算当天是本年本月的第几周
Js 获取当前日期时间及其它操作实现代码
javascript multibox 全选
JS array 数组详解
javascript 对象定义方法 简单易学
javascript 补零 函数集合
div scroll始终在最底部的实现代码
javascript eval()用法
javascript 打印页面代码
JAVASCRIPT THIS详解 面向对象
javascript 页面跳转方法集合

Javascript 中的 使主页呈现“飞舞”特效


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-03   浏览: 254 ::
收藏到网摘: n/a

    朋友,“天上掉陷饼”都听说过吧?呵呵,陷饼它算个么,今天教你一个天上掉¥的招儿,并且~~哗啦啦地掉!哈~哈~哈,来吧^_*

  首先看效果

将下面的JavaScript代码加到< head >区就成了:


< Script Language="JavaScript" >
< !-- Begin
var no = 30;
//设定下落字符数量
var speed = 5;
//设定字符下落的速度
var ns4up = (document.layers) ? 1 : 0;
var ie4up = (document.all) ? 1 : 0;
//NETSCAP和IE两种不同浏览器各自进行定义
var s, x, y, sn, cs;
var a, r, cx, cy;
var i, doc_width = 800, doc_height = 600;
//设定字符下落区域为800*600
if (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
else
if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
//NETSCAP和IE两种浏览器有别
x = new Array();
y = new Array();
r = new Array();
cx = new Array();
cy = new Array();
s = 8;
for (i = 0; i < no; ++ i) {
initRain();
//定义变量数组x, y, cx, cy, s
if (ns4up) {
if (i == 0) {
document.write("< layer name=\"dot"+ i +"\" left=\"1\" ");
document.write("top=\"1\" visibility=\"show\" >< font color=\"white\" >");
document.write(",¥< /font >< /layer >");
}
else {
document.write("< layer name=\"dot"+ i +"\" left=\"1\" ");
document.write("top=\"1\" visibility=\"show\" >< font color=\"white\" >");
document.write(", $ < /font >< /layer >");
}
}
//当i==0满足与否时,NETSCAP中的表现
else
if (ie4up) {
if (i == 0) {
document.write("< div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\" >< font size=\"10\" color=\"white\" >");
document.write("¥< /font >< /div >");
}
else {
document.write("< div id=\"dot"+ i +"\" style=\"POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;\" >< font size=\"10\" color=\"white\" >");
document.write(" $ < /font >< /div >"); //设定要下落的的字符(¥、$)及位置
}
}
//当i==0满足与不满足时,IE浏览器中的表现
}
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 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];
}
function updateRain() {
r[i] += s;
x[i] = r[i] * sn + cx[i];
y[i] = r[i] * cs + cy[i];
}
function raindropNS() {
for (i = 0; i < no; ++ i) {
updateRain();
//定义变量数组 a , sn , cs , cx, cy, s
if ((x[i] < = 1) || (x[i] >= (doc_width - 20)) || (y[i] >= (doc_height - 20))) {
makeRain();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
document.layers["dot"+i].top = y[i];
document.layers["dot"+i].left = x[i];
}
setTimeout("raindropNS()", speed);
}
function raindropIE() {
for (i = 0; i < no; ++ i) {
updateRain();
//在NETSCAP浏览器中的付值过程
if ((x[i] < = 1) || (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);
}
if (ns4up) {raindropNS(); }
else
if (ie4up) {raindropIE(); }
//在IE浏览器中的付值过程
// End -- >
< /Script >