jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享


Posted in Javascript onAugust 20, 2015

这是一款基于jquery实现的漫天雪花飞舞的圣诞祝福雪花效果代码,雪花的大小可以进行切换,用户还可以更改背景图片,是一款非常实用的幻灯片特效源码。

漫天雪花飞舞的jquery圣诞祝福雪花效果,集中不同的效果可以点击选择,请欣赏。

效果演示 源码下载(浏览器中如果不能正常运行,可以尝试切换浏览模式或者选择直接下载)

 jquery实现漫天雪花飞舞的圣诞祝福雪花效果代码分享

 为大家分享的漫天雪花飞舞的jquery圣诞祝福雪花效果代码如下

<!DOCTYPE html>
<html>
<head>
 <script type="text/javascript" src="images/jquery-latest.min.js"></script>
 <script src='images/snowfall.jquery.js'></script>
 <link rel="stylesheet" href="images/styles.css"></link>
</head>
<body class="darkBg">
 <input type="button" id="clear" value="Click to clear"/>
 <input type="button" id="round" value="Rounded"/>
 <input type="button" id="shadows" value="Shadows"/>
 <input type="button" id="roundshadows" value="Rounded Shadows"/>
 <input type="button" id="deviceorientation" value="Deviceorientation"/>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
</body>
 <script type='text/javascript'> 
 $(document).ready(function(){
 $('.collectonme').hide();
 //Start the snow default options you can also make it snow in certain elements, etc.
 $(document).snowfall();
 
 $("#clear").click(function(){
 $(document).snowfall('clear'); // How you clear
 });
 
 $("#round").click(function(){
 document.body.className = "darkBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({round : true, minSize: 5, maxSize:8}); // add rounded
 });
 
 $("#shadows").click(function(){
 document.body.className = "lightBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({shadow : true, flakeCount:200}); // add shadows
 });

 $("#roundshadows").click(function(){
 document.body.className = "lightBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({shadow : true, round : true, minSize: 5, maxSize:8}); // add shadows
 });
 
 

 $("#deviceorientation").click(function(){
 $(document).snowfall('clear');
 $('.collectonme').hide();
 document.body.className = "darkBg";
 $(document).snowfall({deviceorientation : true, round : true, minSize: 5, maxSize:8});
 });

 });
 </script>

<p align="center"><font color="#FFFFFF">来源:</font><a href="https://3water.com/" target="_blank"><font color="#FFFFFF">三水点靠木</font></a></p>
</html>

以上就是为大家分享的漫天雪花飞舞的jquery圣诞祝福雪花效果代码,希望大家可以喜欢。

Javascript 相关文章推荐
获取Javscript执行函数名称的方法
Dec 22 Javascript
JavaScript的public、private和privileged模式
Dec 28 Javascript
调试Javascript代码(浏览器F12及VS中debugger关键字)
Jan 25 Javascript
jquery如何把参数列严格转换成数组实现思路
Apr 01 Javascript
Js动态添加复选框Checkbox的实例方法
Apr 08 Javascript
JS操作Cookies的小例子
Oct 15 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
Sep 08 Javascript
Ztree新增角色和编辑角色回显问题的解决
Oct 25 Javascript
Vue 2.0+Vue-router构建一个简单的单页应用(附源码)
Mar 14 Javascript
Vue.js中的图片引用路径的方式
Jul 28 Javascript
JavaScript使用localStorage存储数据
Sep 25 Javascript
解决vue一个页面中复用同一个echarts组件的问题
Jul 19 Javascript
js实现网页多级级联菜单代码
Aug 20 #Javascript
javascript常用的方法整理
Aug 20 #Javascript
JS实现的Select三级下拉菜单代码
Aug 20 #Javascript
遮罩层点击按钮弹出并且具有拖动和关闭效果(两种方法)
Aug 20 #Javascript
JS实现支持多选的遍历下拉列表代码
Aug 20 #Javascript
jQuery鼠标经过方形图片切换成圆边效果代码分享
Aug 20 #Javascript
jQuery+HTML5实现图片上传前预览效果
Aug 20 #Javascript
You might like
Apache实现Web Server负载均衡详解(不考虑Session版)
2013/07/05 PHP
自制PHP框架之路由与控制器
2017/05/07 PHP
layui框架实现文件上传及TP3.2.3(thinkPHP)对上传文件进行后台处理操作示例
2018/05/12 PHP
JS解密入门之凭直觉解
2008/06/25 Javascript
JavaScript词法作用域与调用对象深入理解
2012/11/29 Javascript
javascript弹出页面回传值的方法
2015/01/28 Javascript
jQuery UI结合Ajax创建可定制的Web界面
2016/06/22 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
2016/09/05 Javascript
Angularjs 制作购物车功能实例代码
2016/09/14 Javascript
微信小程序实现图片预加载组件
2017/01/18 Javascript
微信小程序 首页制作简单实例
2017/04/07 Javascript
JS中将多个逗号替换为一个逗号的实现代码
2017/06/23 Javascript
深入理解ES6的迭代器与生成器
2017/08/19 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
JavaScript高级函数应用之分时函数实例分析
2018/08/03 Javascript
基于JS实现视频上传显示进度条
2020/05/12 Javascript
vue实现购物车案例
2020/05/30 Javascript
[09:47]2018DOTA2亚洲邀请赛4.5SOLO赛 No[o]ne vs Sumail
2018/04/06 DOTA
尝试使用Python多线程抓取代理服务器IP地址的示例
2015/11/09 Python
对Python中列表和数组的赋值,浅拷贝和深拷贝的实例讲解
2018/06/28 Python
Win10下Python3.7.3安装教程图解
2019/07/08 Python
Python如何获取文件路径/目录
2020/09/22 Python
CSS3实现的渐变幻灯片效果
2020/12/07 HTML / CSS
VisionPros美国站:加拿大在线隐形眼镜和眼镜零售商
2020/02/11 全球购物
为数据库创建索引都需要注意些什么
2012/07/17 面试题
幼教个人求职信范文
2013/12/02 职场文书
开办加工厂创业计划书
2014/01/03 职场文书
人事专员岗位职责范本
2014/03/04 职场文书
2014年寒假社会实践活动心得体会
2014/04/07 职场文书
班主任个人工作反思
2014/04/28 职场文书
保护野生动物倡议书
2014/05/16 职场文书
物流专业求职信
2014/06/30 职场文书
领导班子对照检查剖析材料
2014/10/13 职场文书
美丽人生观后感
2015/06/03 职场文书
导游词之介休绵山
2019/12/31 职场文书
浅谈resultMap的用法及关联结果集映射
2021/06/30 Java/Android