jQuery圣诞雪花
<script type="text/javascript">
$(function(){
var d="<div class='y_snow'>❅<div>"
setInterval(function(){
var f=$(document).width(); //获取文档高度
var e=Math.random()*f-300; //f高度随机数减去300
var o=0.3+Math.random(); //0.3+(0-1)之间随机数
var fon=10+Math.random()*30;//10加上(0-30)随机数
var l = e - 100 + 200 * Math.random(); //f高度随机数减去300-100+(0-200)的随机数
var k=2000 + 5000 * Math.random(); //2000+(0-5000)的随机数
$(d).clone().appendTo(".chris_bg").css({//d的代码复制到.chris_bg
left:e+"px", //相对位置左移(f高度随机数减去300)的像素
opacity:o,
"font-size":fon, //文字大小(f高度随机数减去300)的像素
}).animate({
top:"400px",
left:l+"px", //动画左移的变化(f高度随机数减去300-100+(0-200)的随机数)
opacity:0.3,
},k,"linear",function(){$(this).remove()}) //(2000+(0-5000)的随机数)的秒数
},200) //0.2秒执行一次
})
</script>
jQuery圣诞雪花的更多相关文章
- jQuery.snowflake雪花飘落插件
一.前言 前言:最近圣诞节来临,需要在页面上应用一个雪花飘落的效果,做之前产品经理给了我网络上的一个demo,地址是http://demo.lanrenzhijia.com/demo/1225/sd/ ...
- 一款很实用的jQuery鼠标悬浮有动画效果的响应式瀑布流插件
一款很实用的jQuery鼠标悬浮有动画效果的响应式瀑布流插件 在线预览 下载地址 实例代码 <!doctype html> <html lang="zh"> ...
- 仿腾讯QQ竖直滑动导航菜单
菜单就像qq软件的分组,鼠标经过自动显示相应组的内容. 效果体验网址:http://keleyi.com/a/bjad/nf86w2dv.htm 以下是源代码: <html> <he ...
- Jquery网站下雪花的效果
代码如下: <script type="text/javascript" src="jquery.min.js"></script> & ...
- jQuery效果之雪花飘落
实现思路 1.在一定的频率下在页面中生成一定数目的雪花从上往下飘落: 2.在指定的时间内飘落后移除页面: 3.可设置雪花的大小,在一定范围内随机雪花大小: 4.什么时间后清除生成雪花,停止函数. js ...
- 制作炫酷雪花背景的jQuery插件
插件使用十分简单,代码已经放至我的GitHub,大家可以下载以及使用或者更新改进代码. HTML代码源码: <!DOCTYPE html> <html> <head> ...
- canvas雪花特效-jQuery插件实现
这是一款效果十分逼真的html5 canvas下雪场景动画特效插件.这款下雪特效是基于Jason Brown的Snowfall jquery plugin的基础上制作的.在Snowfall jquer ...
- jquery的浪漫(跑马灯 + 雪花飘落)
jquery的浪漫 主要用到知识点: 鼠标事件onmousedown() onmousemove() onmouseup() jquery的运用,对dom元素的增删改查 css3 3d 功能的灵活运用 ...
- jquery/zepto 圣诞节雪花飞扬
下载地址: http://www.html5tricks.com/jquery-html5-christ-snow.html 演示地址: http://www.html5tricks.com/jque ...
随机推荐
- Ajax的简单实用实例
我将实现一个简单的Ajax页面无刷新进行用户验证案例: 效果如下图:
- 配置HTTPS服务
环境为CentOS 7.3.httpd2.4.6 一 搭建证书 说明: CA 主机为192.168.29.3 client主机为 192.168.29.100 1 生成私钥 [root@centos7 ...
- opnet点对点通信模型 分类: opnet 2014-05-26 22:15 246人阅读 评论(3) 收藏
网络包含两个节点,一个发送节点,一个接收节点.发送节点按照某种随机的规律产生数据包(包大小和包间隔可自己定义),然后发送给接收节点.传输过程中会有一些随机的差错(误包率也可自己定义).接收节点收到正确 ...
- ServletAPI的获取
Action中获取ServletAPI,三种方式 (1)通过ActionContext获取(只是获取并操作了域空间,并不是真正的ServletAPI对象) 在struts2框架中,通过Action的执 ...
- SharePoint 2016 配置工作流环境
前言 SharePoint 2016 默认创建工作流的时候,工作流平台只包含2010版本,如果想要使用状态机工作流,需要单独安装workflow manager 1.0才可以,下面,我们为大家介绍一下 ...
- year:2017 month:08 day:04
2017-08-04 JAVAse 1.final修饰符 final可以修饰类,成员方法,成员变量(static 修饰符不可以修饰类) final的初始化在对象被实例化前即可final 修饰的方法不可 ...
- Shopex如何清理缓存
一.进入后台,点击 右上角 的"关于" 二.点击:缓存系统: 三.点击"清空缓存" 四.清除成功!
- S2-032代码执行
Struts 2是Struts的下一代产品,是在 struts 1和WebWork的技术基础上进行了合并的全新的Struts 2框架.其全新的Struts 2的体系结构与Struts 1的体系结构差别 ...
- 剑指offer--二叉树的后序遍历
思路:对于一个二叉树的后序遍历序列来说,最后一个数一定是根节点,然后前面的数中,从最开始到第一个大于根节点的数都是左子树中的数,而后面到倒数第二个数应该都是大于根节点的,是右子树,如果后面的数中有小于 ...
- python--DenyHttp项目(2)--ACM监考客户端测试版(1阶段客户端总结)
客户端: 1.既然脚本是让别人用的,怎么说也得有个界面,(虽然很low) ''' DenyManager.py 调用客户端与客户端界面 ''' from DenyClient import * fro ...