个人网站页面添加雪花飘落背景,超简单的方法

网站建设 尹华峰 浏览 评论来源:www.yinhuafeng.cn

  很多新建站的朋友往往非常在意界面的美观,诸如很多个人博客页面都加了一个很漂亮的雪花飘落背景。想把这个特效加到自己的网站怎么办呢?其实很简单,网上有这类添加雪花背景的方法特别多,可能一些新手朋友不太会用,所以尹华峰SEO技术博客为大家分享一个超简单的方法!

  只需一段简短的代码实现雪花飘落,代码如下:

<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>

<script src="http://itbyc.com/templets/yang/js/snow.js"></script>

<style type="text/css">.snow-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}</style>

<div class="snow-container"></div>

  飘雪背景代码的使用方法

  将上面的代码复制下来,直接放在你需要添加特效的页面<body>下面即可,非常方便,如本站几个页面就添加了该特效,背景特效参考地址:http://www.yinhuafeng.cn/daohang/mulu.html

  本来峰峰是打算全站的栏目页和网站首页都添加该特效的,在添加之后也确实很漂亮。但是发现在手机端打开页面也是有雪花飘落特效,原因是本站是自适应程序,触屏浏览有点不方便,为了不影响手机端浏览,最后峰峰就把这个代码只放在其他个别页面。

  温馨提示:使用该代码的同学,峰峰建议是PC端和移动端是分开的,有单独的m或者wap手机站,当然也有可能是我的模板原因,如果你的个人博客也是自适应程序的话,可以先试用一下,或许不影响手机端的浏览也未可知。