jQuery雪花插件JQuery-Snowfall Plugin

明天就是圣诞节,分享一个好玩的jQuery插件——JQuery-Snowfall Plugin,该插件可以实现在页面上飘落雪花的特效。

JQuery-Snowfall插件的github项目地址:https://github.com/loktar00/JQuery-Snowfall/

调用插件的方式很简单,首先,需要在页面上添加对js源文件snowfall.jquery.js的引用:

<script type="text/javascript" src="https://raw.githubusercontent.com/loktar00/JQuery-Snowfall/master/src/snowfall.jquery.js"></script>

然后使用插件的缺省方式开启雪花特效:

$(document).snowfall();

 

此外,该插件还支持下列参数设置:

1、flakeCount,

2、flakeColor,

3、flakeIndex,

4、minSize,

5、maxSize,

6、minSpeed,

7、maxSpeed,

8、round, true or false, makes the snowflakes rounded if the browser supports it.

9、shadow true or false, gives the snowflakes a shadow if the browser supports it.

示例用法:

$(document).snowfall({flakeCount : 100, maxSpeed : 10});

或者:

$('#element').snowfall({flakeCount : 800, maxSpeed : 5, maxSize : 5});

清除雪花:

$('#element').snowfall('clear');

使用图片作为雪花元素:

$(element).snowfall({image :"images/flake.png", minSize: 10, maxSize:32});

另外,该插件也支持无需jQuery即可使用的纯JavaScript版本。

原文链接:http://bookshadow.com/weblog/2014/12/24/jquery-snowfall-plugin/
请尊重作者的劳动成果,转载请注明出处!书影博客保留对文章的所有权利。

 
posted @ 2016-08-04 17:06  好好学习的  阅读(5957)  评论(0编辑  收藏  举报