Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
17mie32
GitHub Repository: 17mie32/17mie32.github.io
Path: blob/main/libs/others/snow.js
1317 views
1
/*样式一*/
2
//背景雪花飘落特效
3
(function($){
4
$.fn.snow = function(options){
5
var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&#10052;'),
6
documentHeight = $(document).height(),
7
documentWidth = $(document).width(),
8
defaults = {
9
minSize : 10,
10
maxSize : 20,
11
newOn : 1000,
12
flakeColor : "#AFDAEF" /* 此处可以定义雪花颜色,若要白色可以改为#FFFFFF */
13
},
14
options = $.extend({}, defaults, options);
15
var interval= setInterval( function(){
16
var startPositionLeft = Math.random() * documentWidth - 100,
17
startOpacity = 0.5 + Math.random(),
18
sizeFlake = options.minSize + Math.random() * options.maxSize,
19
endPositionTop = documentHeight - 200,
20
endPositionLeft = startPositionLeft - 500 + Math.random() * 500,
21
durationFall = documentHeight * 10 + Math.random() * 5000;
22
$flake.clone().appendTo('body').css({
23
left: startPositionLeft,
24
opacity: startOpacity,
25
'font-size': sizeFlake,
26
color: options.flakeColor
27
}).animate({
28
top: endPositionTop,
29
left: endPositionLeft,
30
opacity: 0.2
31
},durationFall,'linear',function(){
32
$(this).remove()
33
});
34
}, options.newOn);
35
};
36
})(jQuery);
37
$(function(){
38
$.fn.snow({
39
minSize: 5, /* 定义雪花最小尺寸 */
40
maxSize: 50,/* 定义雪花最大尺寸 */
41
newOn: 500 /* 定义密集程度,数字越小越密集 */
42
});
43
});
44