精品插件 原创

WordPress下雪插件+网页下雪特效代码免费分享

爱搜学习网的头像 爱搜学习网 · · 回复 8 回复本帖
只看楼主 倒序浏览 共 8 楼 第 1 / 1 页
楼主 2018-01-27 15:56 3,053 阅读 1#

天寒地冻,各位站长朋友,今天给大家分享福利了。
让你的网页下雪,带来不一样的体验。
分享一个网页下雪特效代码和Wordpress下雪插件,轻松设置即可完成下雪特效。

1,网页下雪特效代码版

复制提供的JS代码,放入网页中就会自动加载特效。

<!– 下面是JS代码,放在body中 –>
<script type=”text/javascript”>
(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” /* 此处可以定义雪花颜色,若要白色可以改为#FFFFFF */
},
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库,可以把下面两段JS导入到网站头部或者底部。

<!– 引入两段JS –>
<script type=”text/javascript” src=”http://libs.baidu.com/jquery/1.8.3/jquery.js”></script>
<script type=”text/javascript” src=”http://libs.baidu.com/jquery/1.8.3/jquery.min.js”></script>

现在看看,网页是不是出现了下雪特效了呢?

Wordpress下雪插件+网页下雪特效代码免费分享

本特效代码的下载地址,下载后自己添加到网站中就可以了,不会添加 自己百度。

2018012707502432

提示:加载过多的JS特效,会影响整体网页速度和时长,如果对速度要求过高,各位站长斟酌后自行安装使用。

2,Wordpress下雪插件版

如果你使用的是WP程序的话,就可以使用Wordpress插件来实现,已经为大家提供一些Wordpress下雪插件:WP Snow Effect   博客后台插件中搜索安装即可。

也可以点击在本站下载  wp-snow-effect.1.1.1

WP Snow Effect插件

启用后就已经启用了下载特效了,是不是很神器呢?当然也可以根据爱好自己设置插件中的参数。英文含义自己搜索翻译吧。

 

提示:加载过多的JS特效,会影响整体网页速度和时长,如果对速度要求过高,各位站长斟酌后自行安装使用。

常见问题

1,网页下雪特效代码版,重点是什么?

复制提供的JS代码,放入网页中就会自动加载特效。 <!-- 下面是JS代码,放在body中 --> <script type="text/javascript"> (function($){ $.fn.snow = function(opt…

2,Wordpress下雪插件版,重点是什么?

如果你使用的是WP程序的话,就可以使用Wordpress插件来实现,已经为大家提供一些Wordpress下雪插件:WP Snow Effect 博客后台插件中搜索安装即可。 也可以点击在本站下载 wp-snow-effect.1.1.1 启…

回复
签名:爱搜学习网站长,14年SEO与网站建设实操经验,专注搜索引擎优化、WordPress建站、百度与Google SEO、服务器运维和网站流量增长。
全部回复 8 正序 倒序
沙发 2018-01-27 21:02 2#

最新出炉的福利分享,赶紧来下载使用吧。

· · 回复
板凳 2018-01-27 21:03 3#

有木有发现,SEO技术博客能够做到当天收录,也就是说,马上发布稍候就能够收录,保持在1小时内,赞一个吧。

· · 回复
地板 2018-01-27 21:06 4#

博客还真是个好东西!

· · 回复
回复 2018-01-29 06:27 5#

61252,大神你是商洛的啊

· · 回复
回复 2018-02-01 17:18 6#

我也用的wpcom主题JN,确实不错

· · 回复
回复 2018-02-04 15:29 7#

不错不错!内容感觉好极了!

· · 回复
回复 2018-02-08 23:44 8#

这个主题确定很好看。

· · 回复
回复 2018-02-08 23:44 9#

你是哪里的?

· · 回复
发表回复请遵守版规,广告与灌水一律删除

支持 HTML 基础标签,如 <blockquote>、<strong>

QQ 微信 Telegram whatsApp
分享本页
返回顶部