内容简介:jQuery效果—雪花飘落
实现思路
1.在一定的频率下在页面中生成一定数目的雪花从上往下飘落;
2.在指定的时间内飘落后移除页面;
3.可设置雪花的大小,在一定范围内随机雪花大小;
4.什么时间后清除生成雪花,停止函数。
js代码
(function($){ $.fn.snow = function(options){ var $flake = $('<div class="flake" />').css({'position': 'absolute', 'top': '-50px'}), documentHeight = $(document).height(), documentWidth = $(document).width(), defaults = { flakeChar : "❄", minSize : 10, maxSize : 20, newOn : 500, flakeColor : '#ffffff', durationMillis: null }, options = $.extend({}, defaults, options); $flake.html(options.flakeChar); var interval = setInterval( function(){ var startPositionLeft = Math.random() * documentWidth - 100, startOpacity = 0.5 + Math.random(), sizeFlake = options.minSize + Math.random() * options.maxSize, endPositionTop = documentHeight - defaults.maxSize - 40, endPositionLeft = startPositionLeft - 100 + Math.random() * 200, durationFall = documentHeight * 10 + Math.random() * 5000; $flake .clone() .appendTo('body') .css({ left: startPositionLeft, opacity: startOpacity, 'font-size': sizeFlake, color: options.flakeColor }) .animate({ top: endPositionTop, left: endPositionLeft, opacity: 0.2 }, durationFall, 'linear', function() { $(this).remove() } ); }, options.newOn); if (options.durationMillis) { setTimeout(function() { clearInterval(interval); }, options.durationMillis); } }; })(jQuery);
调用方式:
$(function(){ $("body").snow({'durationMillis':2000}); //2s后停止生成雪花 })
参数解释:
* @params flakeChar - 实现雪花图案的html字符 * @params minSize - 雪花的最小尺寸 * @params maxSize - 雪花的最大尺寸 * @params newOn - 雪花出现的频率 * @params flakeColors - 雪花颜色 * @params durationMillis - 多少毫米后停止生成雪花 * @example $.fn.snow({ maxSize: 200, newOn: 1000 });
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- jQuery效果—雪花飘落
- 程序员亲自用代码给敲出飘落的雪花!网友:大神收我吧!
- 分布式唯一 ID 解决方案:雪花算法
- Twitter雪花算法SnowFlake算法的java实现
- 分布式SnowFlakeID(雪花ID)原理和改进优化
- 认识“雪花ID”:如何在分布式环境中大规模生成唯一ID?
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Types and Programming Languages
Benjamin C. Pierce / The MIT Press / 2002-2-1 / USD 95.00
A type system is a syntactic method for automatically checking the absence of certain erroneous behaviors by classifying program phrases according to the kinds of values they compute. The study of typ......一起来看看 《Types and Programming Languages》 这本书的介绍吧!