雪花飄飄特效


大家一進到小穎噠博客就看到好多雪花在飄,是不是覺得很美呢,接下來小穎就把這個技能告訴大家,可是大家記得打賞小穎哦!嘻嘻

第一步:

         在網上下載jquery.js和jq.snow.js,並將它們通過“管理”->“文件”,上傳至博客文件夾。

第二步:

          找到“我的博客”->“管理”->“設置”,找到“頁首Html代碼”這個位置,將下面的代碼復制進去。

     注意: 紅色部分需要修改為你的博客地址名。實在不知道的話,你可以通過“我的博客”->“管理”->“設置”找到

                        <script src="http://files.cnblogs.com/files/yingzi1028/jquery.js"></script>
                        <script src="http://files.cnblogs.com/files/yingzi1028/jq.snow.js"></script>

    <script src="http://files.cnblogs.com/files/yingzi1028/jquery.js"></script>
    <script src="http://files.cnblogs.com/files/yingzi1028/jq.snow.js"></script>
    <script>
        $(function() {
            $.fn.snow({
                minSize: 5, //雪花的最小尺寸
                maxSize: 40, //雪花的最大尺寸
                newOn: 100 //雪花出現的頻率 這個數值越小雪花越多
            });
        });
    </script>

 第三步:

        其實這個大家也可以不用加,我是嫌棄不加頁面橫縱有滾動條丑的很,所以加了下面的樣式:     

                  

    找到“我的博客”->“管理”->“設置”,找到“頁面定制CSS代碼”這個位置,將下面的代碼復制進去。然后點擊保存就好了。

 下面呢,小穎再給大家看下小穎寫的一個demo嘻嘻,希望大家能夠喜歡哦。大家要是想要背景圖、js什么的可以聯系小穎,小穎發給你嘻嘻。

先看看效果圖:

代碼代碼看這里:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>雪花滿屏飛</title>
    <script src="js/jquery.js"></script>
    <style media="screen">
        body {
            background: #3B3B3B url(images/bg.jpg) no-repeat center;
            color: #ccc;
            height: 1050px;
            overflow-x: hidden;
        }
    </style>
</head>

<body>
    <div style="display:none"></div>
    <script src="js/jq.snow.js"></script>
    <script>
        $(function() {
            $.fn.snow({
                minSize: 5, //雪花的最小尺寸
                maxSize: 40, //雪花的最大尺寸
                newOn: 100 //雪花出現的頻率 這個數值越小雪花越多
            });
        });
    </script>
</body>

</html>

 Git地址:點這里

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM