送上段模拟圣诞节下雪的javascript 代码
平安夜我就不多说什么啦,现在Jeff 正在看刚刚出炉的神探夏洛克第三季的圣诞特辑迷你短剧以及纪录片《Unlocking Sherlock 2014》。咱在这里送上一段模拟圣诞节下雪的javascript 代码,效果就是本站的效果啦~
该段代码来源于Xmas Snow 插件,见《迎圣诞,13款WordPress 圣诞装饰插件推荐》一文。你可以直接复制到主题的footer.php那里或者直接添加到现有的js 文件。Merry Christmas!
<script type="text/javascript"> // Set the number of snowflakes (more than 30 - 40 not recommended) var snowmax=50 // Set the colors for the snow. Add as many colors as you like var snowcolor=new Array("#aaaacc","#ddddff","#ccccdd","#f3f3f3","#f0ffff","#bbf7f9") // Set the fonts, that create the snowflakes. Add as many fonts as you like var snowtype=new Array("Times","Arial","Times","Verdana") // Set the letter that creates your snowflake (recommended: * ) var snowletter="*" // Set the speed of sinking (recommended values range from 0.3 to 2) var sinkspeed=0.6 // Set the maximum-size of your snowflakes var snowmaxsize=30 // Set the minimal-size of your snowflakes var snowminsize=8 // Set the snowing-zone // Set 1 for all-over-snowing, set 2 for left-side-snowing // Set 3 for center-snowing, set 4 for right-side-snowing var snowingzone=1 /////////////////////////////////////////////////////////////////////////// var snow=new Array() var marginbottom var marginright var timer var i_snow=0 var x_mv=new Array(); var crds=new Array(); var lftrght=new Array(); var browserinfos=navigator.userAgent var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/) var ns6=document.getElementById&&!document.all var opera=browserinfos.match(/Opera/) var browserok=ie5||ns6||opera function randommaker(range) { rand=Math.floor(range*Math.random()) return rand } function initsnow() { if (ie5 || opera) { marginbottom = document.body.scrollHeight marginright = document.body.clientWidth-15 } else if (ns6) { marginbottom = document.body.scrollHeight marginright = window.innerWidth-15 } var snowsizerange=snowmaxsize-snowminsize for (i=0;i<=snowmax;i++) { crds[i] = 0; lftrght[i] = Math.random()*15; x_mv[i] = 0.03 + Math.random()/10; snow[i]=document.getElementById("s"+i) snow[i].style.fontFamily=snowtype[randommaker(snowtype.length)] snow[i].size=randommaker(snowsizerange)+snowminsize snow[i].style.fontSize=snow[i].size+'px'; snow[i].style.color=snowcolor[randommaker(snowcolor.length)] snow[i].style.zIndex=1000 snow[i].sink=sinkspeed*snow[i].size/5 if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)} if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4} if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2} snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size) snow[i].style.left=snow[i].posx+'px'; snow[i].style.top=snow[i].posy+'px'; } movesnow() } function movesnow() { for (i=0;i<=snowmax;i++) { crds[i] += x_mv[i]; snow[i].posy+=snow[i].sink snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+'px'; snow[i].style.top=snow[i].posy+'px'; if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])){ if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)} if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4} if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2} snow[i].posy=0 } } var timer=setTimeout("movesnow()",50) } for (i=0;i<=snowmax;i++) { document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"'>"+snowletter+"</span>") } if (browserok) { window.onload=initsnow } </script> |
---|
- 深入理解Android Build系统
- Mac Jenkins搭建 Android/IOS自动打包环境
- javascript 红皮高程(11)
- javascript 红皮高程(8)
- javascript 红皮高程(7)
- javascript 红皮高程(17)-- 左移(<<)
- javascript 红皮高程(17)-- 按位异或(XOR)
- javascript 红皮高程(17)
- javascript 红皮高程(16)
- javascript 红皮高程(15)
- javascript 红皮高程(21)-- 乘性操作符
- javascript 红皮高程(20)-- 逻辑或
- javascript 红皮高程(19)-- 逻辑与
- 技术分享 | 浅谈 RAS
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 【动手学深度学习笔记】之构造MLP模型的几种方法
- 【动手学深度学习笔记】之通过丢弃法缓解过拟合问题
- 【动手学深度学习笔记】之通过权重衰减法解决过拟合问题
- 【动手学深度学习笔记】之多层感知机实现
- Linux程序员效率工具:比man更好用的命令提示工具
- 我对torch中的gather函数的一点理解
- 冒泡排序的实现思路和优化方案
- Java Map转对象
- 59.Vue 使用webpack构建vue项目
- Android初学设置文字跑马灯效果
- 使用Zolom内存解析运行python脚本(不落地)
- 要点3:输入函数对比与自定义输入方式
- 性能测试必备命令(3)- lscpu
- 性能测试必备命令(2)- uptime
- Lua/luajit 点与冒号的区别