好长一段时间没有更新文章了,主要原因是最近忙于过年没怎么折腾网站确实不知道更新些什么了,心想着再不更新博客就要长草了。俗话说的好“车到山前必有路”,既然最近一直在忙于过年,那么分享一篇与过年这个节日相关的文章想来应该是极好的,思考了半天决定整理分享下“雪花飘落效果”的源码比较好,遂有了这篇文章,经过多方比较,觉的雅兮网的这段源码无论从部署难易度还是从代码简洁性来看都是很不错的,我自己也使用上了这段代码为博客烘托下节日气氛。代码部分有些细微改动以进一步简化大家部署的困难,下面将具体部署方法分享一下。
雪花图片
在网站根目录下新建一个名为 snow 的文件夹,将雪花图片文件分别命名为 snow0.gif、 snow1.gif、 snow2.gif、 snow3.gif ,然后丢在该文件夹下。
#gallery-1 {
margin: auto;
}
#gallery-1 .gallery-item {
float: left;
margin-top: 10px;
text-align: center;
width: 25%;
}
#gallery-1 img {
border: 2px solid #cfcfcf;
}
#gallery-1 .gallery-caption {
margin-left: 0;
}
/* see gallery_shortcode() in wp-includes/media.php */
JS 代码
将以下代码保存为 snow.js 文件并丢在上面新建的 snow 文件中即可。
注意代码中文件名及相应路径。
引入文件
使用如下代码在需要显示雪花效果的页面中进行调用。WordPress用户一般将代码添加到 header.php 或者 footer.php文件中即可,如果只想在文章页面显示,直接将代码添加到 single.php 文件中即可。
因为需要使用的文件比较零散,这里提供下文件的下载。