JAVA圣诞代码_[Java教程]【Merry Christmas】圣诞节,给博客添加浪漫的下雪效果!...

[Java教程]【Merry Christmas】圣诞节,给博客添加浪漫的下雪效果!

0 2012-12-25 15:00:20

一年一度的圣诞节又到了,首先祝大家好运一串串,健康一年年,平安到永远!在这个特殊的日子里,处处洋溢着节日的气氛,空中飘落的雪花更显得浪漫!今天就教大家如何在博客中添加纷纷扬扬的下雪效果。今天,你那里下雪了吗?

bc91bb04e6e9c61e24c974e4440db8f2.gif

首先在页面引入 jQuery 库和 jQuery.snow.js(或者使用压缩版本 jQuery.snow.min.js):

博客园的朋友可以不用引入 jQuery,因为博客园自身已经引入了。不是博客园的朋友也可以引用 Goolgle CDN 提供的 jQuery:

然后在页面文档的任何地方调用下雪插件就可以了:

你也可以根据自己的喜好设置插件提供的参数来调整下雪的效果:minSize /* 雪花的最小尺寸,默认值 10 */maxSize /* 雪花的最小尺寸,默认值 20 */newOn /* 每毫秒雪花出现的频率,默认是 500 */flakeColor /* 雪花的颜色,默认值是白色 #FFFFFF */

例如可以传递下面这样形式的参数:$.fn.snow({ minSize: 5, maxSize: 50, newOn: 1000, flakeColor: '#0099FF' });

需要注意的是,在使用 newOn 参数的时候得小心,设置过大会有性能问题,浏览器可能会卡住。

最后向大家简单介绍一下这个下雪效果实现的要点:使用字符 ❄ 作为雪花,Unicode 编码是:❄,因此雪花的大小和颜色控制其实就是设置 font-size 和 color 属性。

使用 setInterval 周期性生成雪花,频率使用 newOn 控制。

下面是下雪插件的完整代码:(function($){$.fn.snow = function(options){var $flake = $('

园子里的朋友只要把下面代码添加到页脚HTML代码中就可以了,非简单!

bc91bb04e6e9c61e24c974e4440db8f2.gif

刷新页面浏览效果     完整源码下载

您可能感兴趣相关文章2012年度最佳 jQuery 插件隆重揭晓

Web前端开发人员和设计师必读文章

10套精美的免费网站后台管理系统模板

8个惊艳的 HTML5 和 JavaScript 特效

60款很酷的 jQuery 幻灯片演示和下载

本文链接:圣诞节到了,给博客添加浪漫的下雪效果!

编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源

hide 本文网址:http://www.shaoqun.com/a/50276.html

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:admin@shaoqun.com。

0

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值