<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. Jenkins2 实现持续交付初次演练(MultiJob,Pipeline,Blue Ocean)

    背景 项目需要用到自动部署,但可获取外网的节点机器只有一台,那只能同过主节点机器进行构建完成然后分发至对应服务器进行启动更新. 目前已尝试过三种方式: 1.Pipeline-Trigger param ...

  2. Java网络连接之HttpURLConnection、HttpsURLConnection

    工具类包含两个方法: http请求.https请求 直接看代码: package com.jtools; import java.io.BufferedReader; import java.io.I ...

  3. Apache Flume 1.7.0 各个模块简介

    Flume简介 Apache Flume是一个分布式.可靠.高可用的日志收集系统,支持各种各样的数据来源,如http,log文件,jms,监听端口数据等等,能将这些数据源的海量日志数据进行高效收集.聚 ...

  4. Spring源码情操陶冶-AbstractApplicationContext#invokeBeanFactoryPostProcessors

    阅读源码有利于陶冶情操,承接前文Spring源码情操陶冶-AbstractApplicationContext#postProcessBeanFactory 约定:web.xml中配置的context ...

  5. Java之集合的遍历与迭代器

    集合的遍历 依次获取集合中的每一个元素 将集合转换成数组,遍历数组 //取出所有的学号, 迭代之后显示学号为1004-1009 Object[] c=map.keySet().toArray();// ...

  6. 花了一年时间开发的三维弯管机交互式转档软件(三维管子模型UG,SOLIDWORK,PRO/E文件转成YBC)

    在弯管机加工中,由管子模型生成可直接进行弯管加工的YBC数据可以大大提高弯管编程过程.传统的做法是先用dxf数据文件(用autocad绘制管子的轴心线数据)转出XYZ数据,然后由XYZ数据转成YBC数 ...

  7. 解决删除元素动画的bug

    效果说明 首先说明一下我需要做到的效果 其实很简单---点击删除按钮的时候,加入删除动画 删除动画是这样的,高度和宽度都会均匀的变小,内部的元素需要被隐藏(因为会有文字挤在一起):直到变为0结束,时长 ...

  8. 31. leetcode 122. Best Time to Buy and Sell Stock II

    122. Best Time to Buy and Sell Stock II Say you have an array for which the ith element is the price ...

  9. Mysql自动填充测试数据

    前言 最近写了两个小脚本,一个应用于Mysql的自动填充测试数据,另外一个是bash写的定期删除日志文件,两个脚本如何使用,在GitHub上面都有所说明,这里不再赘述,这里主要是想聊一下Mysql的存 ...

  10. 小兴趣:用python生成excel格式座位表

    脚本分两个文件: 1.生成二维随机列表:GenerateLocaltion.py 2.将列表导入excel文件:CreateExcel.py 先上GenerateLocaltion.py: impor ...