<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圣诞雪花的更多相关文章

  1. jQuery.snowflake雪花飘落插件

    一.前言 前言:最近圣诞节来临,需要在页面上应用一个雪花飘落的效果,做之前产品经理给了我网络上的一个demo,地址是http://demo.lanrenzhijia.com/demo/1225/sd/ ...

  2. 一款很实用的jQuery鼠标悬浮有动画效果的响应式瀑布流插件

    一款很实用的jQuery鼠标悬浮有动画效果的响应式瀑布流插件 在线预览 下载地址 实例代码 <!doctype html> <html lang="zh"> ...

  3. 仿腾讯QQ竖直滑动导航菜单

    菜单就像qq软件的分组,鼠标经过自动显示相应组的内容. 效果体验网址:http://keleyi.com/a/bjad/nf86w2dv.htm 以下是源代码: <html> <he ...

  4. Jquery网站下雪花的效果

    代码如下: <script type="text/javascript" src="jquery.min.js"></script> & ...

  5. jQuery效果之雪花飘落

    实现思路 1.在一定的频率下在页面中生成一定数目的雪花从上往下飘落: 2.在指定的时间内飘落后移除页面: 3.可设置雪花的大小,在一定范围内随机雪花大小: 4.什么时间后清除生成雪花,停止函数. js ...

  6. 制作炫酷雪花背景的jQuery插件

    插件使用十分简单,代码已经放至我的GitHub,大家可以下载以及使用或者更新改进代码. HTML代码源码: <!DOCTYPE html> <html> <head> ...

  7. canvas雪花特效-jQuery插件实现

    这是一款效果十分逼真的html5 canvas下雪场景动画特效插件.这款下雪特效是基于Jason Brown的Snowfall jquery plugin的基础上制作的.在Snowfall jquer ...

  8. jquery的浪漫(跑马灯 + 雪花飘落)

    jquery的浪漫 主要用到知识点: 鼠标事件onmousedown() onmousemove() onmouseup() jquery的运用,对dom元素的增删改查 css3 3d 功能的灵活运用 ...

  9. jquery/zepto 圣诞节雪花飞扬

    下载地址: http://www.html5tricks.com/jquery-html5-christ-snow.html 演示地址: http://www.html5tricks.com/jque ...

随机推荐

  1. Docker进阶使用1

    容器间共享文件 Docker 的容器和外部环境是相对隔离的,并且容器是一次性的,运行结束后并不会有任何的持久化的文件或者数据.所以当我们需要做应用数据的持久化,或者保留应用的日志文件时,我们需要用到 ...

  2. CloseHandle 函数--关闭一个句柄

    CloseHandle函数 来源:https://msdn.microsoft.com/en-us/library/windows/desktop/ms724211(v=vs.85).aspx 作用 ...

  3. Cocoapods最新安装教程

    一.CocoaPods简介 每种语言发展到一个阶段,就会出现相应的依赖管理工具,例如 Java 语言的 Maven,nodejs 的 npm.随着 iOS 开发者的增多,业界也出现了为 iOS 程序提 ...

  4. 【Django】request 处理流程(转)

    Django 和其他 Web 框架的 HTTP 处理的流程大致相同,Django 处理一个 Request 的过程是首先通过中间件,然后再通过默认的 URL 方式进行的.我们可以在 Middlewar ...

  5. juquery 中 size()和length的区别 以及优缺点

    size()是jQuery提供的函数,而length是属性(不带括号).jQuery提供的源代码是这样的:size: function() {return this.length;}其实也就是说,在j ...

  6. webpack2 前篇

    webpack2 前篇 #webpack 前两天用了一天半时间琢磨了下webpack2,想起去年这时候,面对webpack1那样恶心的文档,前前后后搞了好几次才摸索清楚,那真是吐了. 划重点 其实we ...

  7. Restful接口调用方法超详细总结

    由于在实际项目中碰到的restful服务,参数都以json为准.这里我获取的接口和传入的参数都是json字符串类型.发布restful服务可参照文章http://www.cnblogs.com/jav ...

  8. WIN10-64+CUDA8.0+OpenCV3.0+VS2015配置

    在网上参考了各位前辈的攻略后,捣鼓了两天总算配置成功了. 目前网上多的还是ubuntu上配置CUDA的教程比较多比较详尽,但是我现在就是想在windows10上跑啊,就是想用CUDA啊... 1.CU ...

  9. NYOJ 108 士兵杀敌1(树状数组)

    首先,要先讲讲树状数组: 树状数组(Binary Indexed Tree(BIT), Fenwick Tree)是一个查询和修改复杂度都为log(n)的数据结构.主要用于查询任意两位之间的所有元素之 ...

  10. ecshop中的些assign_dynamic(’')

    很多做电子商务站的朋友都问我,在ecshop中,里面有个 assign_dynamic('index');这个到底是什么作用来的,这个其实是ecshop中的模板技术,动态处理一些局部信息更新而不被缓存 ...