当前位置：首页 » » 一行JS代码给实现Blog页面下雪效果

一行JS代码给实现Blog页面下雪效果

一行JS代码给实现Blog页面下雪效果,阅读一行JS代码给实现Blog页面下雪效果，正如你在我的博客上看到的，全屏，以为本站背景是纯白，看不到雪花，所以本博客已经修改了雪花的颜色(把代码中的这个颜色修改一下即可flakeColor: "#AFDAEF")，代码如下（本代码需要加载jquery，如果你的博客没有加载，请直接把<script type="text/javascript" src="http://1218.sheli.sinaapp.com/js-sheli/jquery.min.js"></script>放入你的博客<head></head>之间）：

<script>(function($){$.fn.snow = function(options){var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&#10052;'),documentHeight= $(document).height(),documentWidth= $(document).width(),defaults = {minSize:10,maxSize:20,newOn:1000,flakeColor: "#AFDAEF"},options= $.extend({}, defaults, options);var interval= setInterval( function(){var startPositionLeft = Math.random() * documentWidth - 100,startOpacity = 0.5 + Math.random(),sizeFlake = options.minSize + Math.random() * options.maxSize,endPositionTop = documentHeight - 200,endPositionLeft = startPositionLeft - 500 + Math.random() * 500,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);};})(jQuery);$(function(){$.fn.snow({minSize:5,maxSize:50,newOn:300});});</script>

把上面代码直接放入你想要放入的地方，当然也可以直接放入你的js文件中（ps：主要要去掉<script></script>）

End

温馨提示：如果您对本文有疑问，请在本页留言即可！！！

觉得很赞 (0)付款方式

付款方式：