博客園自定義css樣式與js特效-有解無憂

本文參考?：https://www.cnblogs.com/menxin

就拿我的博客樣式來做效果展示吧：https://www.cnblogs.com/SuperBrother/

開始教程：

　　首先找到設定選項，或者直接輸入連接：https://i-beta.cnblogs.com/settings

　　　　如圖：

沒截到的地方不太方便展示，接下來就可以開始寫代碼了

注意，先在這里申請開通js 權限

將博客皮膚選項選擇為MTClean ，然后將下面代碼復制到 ->頁面定制 CSS 代碼

.snow-container {
  position: fixed;
  top:0;
  left:0;
  right: 0;
  bottom:0;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
  background-color: none;
}

.snow {
  display: block;
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  -webkit-transform: translate3d(0, -100%, 0);
          transform: translate3d(0, -100%, 0);
  -webkit-animation: snow linear infinite;
          animation: snow linear infinite;
}
.snow.foreground {
  background-image: url("https://dl6rt3mwcjzxg.cloudfront.net/assets/snow/snow-large-075d267ecbc42e3564c8ed43516dd557.png");
  -webkit-animation-duration: 15s;
          animation-duration: 15s;
}
.snow.foreground.layered {
  -webkit-animation-delay: 7.5s;
          animation-delay: 7.5s;
}
.snow.middleground {
  background-image: url(https://dl6rt3mwcjzxg.cloudfront.net/assets/snow/snow-medium-0b8a5e0732315b68e1f54185be7a1ad9.png);
  -webkit-animation-duration: 20s;
          animation-duration: 20s;
}
.snow.middleground.layered {
  -webkit-animation-delay: 10s;
          animation-delay: 10s;
}
.snow.background {
  background-image: url(https://dl6rt3mwcjzxg.cloudfront.net/assets/snow/snow-small-1ecd03b1fce08c24e064ff8c0a72c519.png);
  -webkit-animation-duration: 30s;
          animation-duration: 30s;
}
.snow.background.layered {
  -webkit-animation-delay: 15s;
          animation-delay: 15s;
}

@-webkit-keyframes snow {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
  100% {
    -webkit-transform: translate3d(15%, 100%, 0);
            transform: translate3d(15%, 100%, 0);
  }
}

@keyframes snow {
  0% {
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
  100% {
    -webkit-transform: translate3d(15%, 100%, 0);
            transform: translate3d(15%, 100%, 0);
  }
}
/** 原有樣式修改 */
    #sideBar{
        display: none;
    }
    #mainContent{
        width: 100%;
        box-shadow: 0 0 0;
        border-radius: 0px;
        opacity: 0;
        transition:0.5s;
        margin-top:40px;
    }
    #main{
        width: 60%;
        background-color: white;
        /*max-width: 700px;*/
       padding-right: 0px;
       margin:auto;
    }
    @media screen and (max-width: 1000px) {
     #main {width: 100%;}
    }
    body{
        background-image: none;
        background-color: white;
        font-family: Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace !important;
        line-height: 1.8;
    }
    #cnblogs_post_body{
        font-size: 16px;
    }
    #green_channel{
        display: none;
    }
    #post_next_prev{
        display: none;
    }
    .forFlow img{
        margin-top: 0;
    }

    /** 去除廣告 */
    #cb_post_title_url{
        display: none;
    }
    #cnblogs_c1{
        display: none;
    }
    #cnblogs_c2{
        display: none;
    }
    #ad_t2{
        display: none;
    }
    #kb_block{
        display:none
    }
    #under_post_news{
        display:none
    }
    #header{
        display:none
    }
    #BlogPostCategory{
        display: none;
    }
    #comment_nav{
        display: none;
    }
    .postDesc{
        border-bottom:none;
    }
    #author_profile_follow{
        display: none;
    }

    /** 自定義樣式 */
    /* 加載條 */
    #myProgressBar{
        width: 15%;
        height: 2px;
        background-color: #eb5055;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 999;
    }
    #nprogress {
      pointer-events: none;
    }

    #nprogress .bar {
      background: #eb5055;

      position: fixed;
      z-index: 1031;
      top: 0;
      left: 0;

      width: 100%;
      height: 2px;
    }
    #nprogress .peg {
      display: block;
      position: absolute;
      right: 0px;
      width: 100px;
      height: 100%;
      box-shadow: 0 0 10px #eb5055, 0 0 5px #eb5055;
      opacity: 1.0;

      -webkit-transform: rotate(3deg) translate(0px, -4px);
          -ms-transform: rotate(3deg) translate(0px, -4px);
              transform: rotate(3deg) translate(0px, -4px);
    }
    #nprogress .spinner {
      display: block;
      position: fixed;
      z-index: 1031;
      top: 15px;
      right: 15px;
    }

    #nprogress .spinner-icon {
      width: 18px;
      height: 18px;
      box-sizing: border-box;

      border: solid 2px transparent;
      border-top-color: #eb5055;
      border-left-color: #eb5055;
      border-radius: 50%;

      -webkit-animation: nprogress-spinner 400ms linear infinite;
              animation: nprogress-spinner 400ms linear infinite;
    }
    .nprogress-custom-parent {
      overflow: hidden;
      position: relative;
    }
    .nprogress-custom-parent #nprogress .spinner,
    .nprogress-custom-parent #nprogress .bar {
      position: absolute;
    }

    @-webkit-keyframes nprogress-spinner {
      0%   { -webkit-transform: rotate(0deg); }
      100% { -webkit-transform: rotate(360deg); }
    }
    @keyframes nprogress-spinner {
      0%   { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }


    /** 導航欄 */
    #mynavbar{
        width: 100%;
        height: 70px;
        position: fixed;
        display: block;
        top: 0px;
        z-index: 100;
        background-color: white;
        transition:0.5s ease-in-out;
        box-shadow: 0 1px 5px rgba(0,0,0,.1);
    }
    #mynavbar_menu{
        display: inline-block;
        width: auto;
        position: relative;
        float: right;
        text-align: right;
        line-height: 68px;
    }
    #mynavbar_menu a{
        padding: 0 15px;
        font-size: 14px;
        outline: 0;
        color: #313131;
        text-decoration: none;
    }
    #mynavbar_menu a:hover{
        color: #eb5055 !important;
    }

    /** 頭部 */
    #myheader{
        background-color: #2175bc!important;/**頂部背景欄底色 */
        margin-top:70px;
        position: relative;
        width: 100%;
        height: 300px;
    }
    #myheader_bg{
        width:100%;
        height:300px;
        background-position: center;
        background-size: cover;
        -webkit-filter: blur(0px);
        -moz-filter: blur(0px);
        filter: blur(0px);
        position: absolute;
    }
    #myheader_cover{
        position: relative;
        margin-top: 70px;
        width: 100%;
        height: 300px;
        background-color: rgba(0,0,0,.5);
        box-shadow: 0 1px 5px rgba(0,0,0,.3);
    }
    #mypost_title{
        position: relative;
        top: 105pt;
        margin: 0 auto;
        padding: 30px 25px 20px;
        max-width: 700px;
        color: white;
        transition:0.5s;
        opacity: 0;
    }
    #mypost_title_e{
        margin: 0;
        padding: 5px 0 15px;
    }
    #mypost_title_e a{
        border: 1px solid #6fa3ef; /**  簽名欄邊框顏色*/
        border-radius: 15px;
        background: #6fa3ef;  /**簽名欄顏色*/
        color: #fff;display: inline-block;
        margin: 4px 8px 0 0;
        padding: 0 15px;
        letter-spacing: 0;
        font-weight: 600;
        font-size: 13px;outline: 0;text-decoration: none;
        transition: 0.5s;
    }
    #mypost_title_e a:before{
        content: "# "
    }
    #mypost_title_e a:hover{
        background-color: white;
        border: 1px solid white;
        color:black;
    }
    #mypost_title_f a{
        color: white;
    }
    #mypost_title_f a:hover{
        text-decoration:none;
    }

    /** 右側導航 */
    #right_meun{
        position: fixed;
        z-index: 999;
        top: 100px;
        left: 75%;
        display: none;
        text-align: left;
        border-left: 1px solid #ddd;
        font-size: 10px;
    }
    #right_meun li{
        list-style: none!important;
    }
    #right_meun a{
        display: inline-table;
        margin-left: 5px;
        white-space: nowrap;
        text-decoration: none;
        color: #313131;
        outline: 0;
    }
    #right_meun a:hover{
        color: #eb5055;
    }
    #right_meun>li::before {
        position: relative;
        top: 0;
        left: -4px;
        display: inline-block;
        width: 7px;
        height: 7px;
        content: '';
        border-radius: 50%;
        background-color: #eb5055;
    }
    /* 底部導航 */
    #post-bottom-bar{
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 2;
        height: 3pc;
        border-top: 1px solid #e0e0e0;
        background-color: #fff;
        margin: 0;
        padding: 0;
        transition: 0.5s ease-in-out;
    }
    #post-bottom-bar a{
        text-decoration: none!important;
    }
    .post-bottom-bar .bottom-bar-inner{
        margin: 0 auto;
        padding: 0 10px;
        max-width: 900px;
    }
    .bottom-bar-items{
        margin: 0 0 0 10px;
        color: #313131;
        font-size: 14px !important;
        line-height: 3pc;float: left;
    }
    .post-bottom-bar{
        margin: 0 0 0 10px;
        color: #313131;
        font-size: 14px;
        line-height: 3pc;
    }
    .post-bottom-bar .social-share .bottom-bar-item {
        padding: 4px;
    }
    .post-bottom-bar .bottom-bar-item.bottom-bar-facebook a {
        background-color: #1b95e0;
        color: #fff;
    }
    .post-bottom-bar .social-share .bottom-bar-item a {
        padding: 2px 10px;
        border-radius: 15px;
    }
    .post-bottom-bar .bottom-bar-item a {
        margin: 0;
        padding: 9pt;
        border: 0;
        background: 0 0;
        color: #eb5055;
        font-size: 14px;
        line-height: 3pc;
        cursor: pointer;
    }
    .post-bottom-bar .bottom-bar-item.bottom-bar-twitter a {
        background-color: #1b95e0;
        color: #fff;
    }
    .post-bottom-bar .bottom-bar-item.bottom-bar-qrcode a {
        background-color: #1b95e0;
        color: #fff;
    }
    .bottom-bar-item a:hover{
        color: #eb5055;
    }


    /** MarkDown樣式調整 */
    .cnblogs-markdown .hljs{
        font-size: 16px!important;
        line-height: 2!important;
        padding: 15px!important;
    }
    .cnblogs-markdown code{
        background:rgb(238,240,244) none !important;
        border:0px !important;
        color: rgb(73,59,92) !important;
        font-size: 16px!important;
    }
    .cnblogs-markdown h2{
        font-weight: 500;
        margin: 20px 0;
    }
    .cnblogs-markdown h2:before{
        content: "#";
        color: #eb5055;
        position: relative;
        top: 0;
        left: -12px;
    }
    #cnblogs_post_body h2{
        font-weight: 500;
        margin: 20px 0;
    }
    #cnblogs_post_body h3{
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
        margin: 10px 0;
    }
    .cnblogs-markdown h3:before{
        content: "##";
        color: #2175bc;
        position: relative;
        top: 0;
        left: -8px;
    }
    .postBody blockquote, .postCon blockquote{
        background-image: none;
        border-left: 5px solid #DDDFE4;
        background-color: #EEF0F4;
        width: 100%;
        padding: 6px 0 6px 25px;
    }
    blockquote{
        border:0;
    }
    /* code加上行數 */
    .cnblogs-markdown .syntaxhighlighter table td.code {
      width:95% !important; 
    }

    .cnblogs-markdown .syntaxhighlighter code {
      font-family: "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;
      padding: 0 !important;
      border-radius: 0 !important;
      background-color: transparent !important;
    }

    .cnblogs-markdown .syntaxhighlighter code:before,
    .cnblogs-markdown .syntaxhighlighter code:before {
      letter-spacing: -0.5em;
    }


    /** 更改瀏覽器滾動條和選中字體背景顏色 */
    ::selection {
        background-color: #2175bc;
        color: #fff;
    }
    ::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }
    ::-webkit-scrollbar-thumb {
        min-height: 28px;
        background-color: #eb5055;
        background-clip: padding-box;
    }
    ::-webkit-scrollbar-track-piece {
        background-color: #fff;
    }
    *, :after, :before {
        box-sizing: border-box;
    }
#leftmenu {
    display:none;

}
#tagline{
display:none;
}
#Header1_HeaderTitle {
display:none;
}
#top{
border-top:0px double #666;
}
.postTitle2 {
font-size: 20px;
    padding-right: 64px;
    padding-left: 10px;
    border-left-width: 3px;
    border-left-style: solid;
    border-left-color: #2175bc;

}
div.post h2 a:link {
   font-size:18x;
}
p.postfoot {
    font-size: 12px;
    color: #999;
margin-left:60%;

}
a:link, a:visited {
text-decoration: none;
    color: #39f;
}
.c_b_p_desc {
color: #606060;
font-size: 12px;
}

將下面代碼復制到 -> 頁首 HTML 代碼

<div >
  <div ></div>
  <div ></div>
  <div ></div>
  <div ></div>
  <div ></div>
  <div ></div>
</div>
<!-- 自定義進度條 -->
<div id="myProgressBar"></div>

<!-- 自定義導航條 -->
<div id="mynavbar">
    <div style="position:relative;width:65pc;height:70px;margin:0 auto;">
        <a style="width: auto;height: 22px;margin-left: 25px;" href="https://www.cnblogs.com/SuperBrother/">
            <img style="width: auto;height: 22px;outline: 0;margin-top: 25px;" src="https://img.uj5u.com/2020/09/16/73460160155423.png">
        </a>
        <div id="mynavbar_menu">
            <a href="https://www.cnblogs.com/SuperBrother/">首頁</a>
            <a href="https://i.cnblogs.com/Configure.aspx">設定</a>
            <a href="https://i-beta.cnblogs.com/posts/edit">新隨筆</a>
            <a href="https://msg.cnblogs.com/send/menxin-">聯系</a>
            <a href="https://www.cnblogs.com/SuperBrother/p/#">Github</a>
            <a href="https://www.cnblogs.com/">博客園</a>
        </div>
    </div>
</div>

<!-- 自定義頭部錨點 -->
<a name="mtop"></a>

<!-- 自定義頭部 -->
<div id="myheader">
    <!-- 背景圖片 -->
    <div id="myheader_bg"></div>
    <!-- 遮罩層 -->
    <div id="myheader_cover" title="點我點我">
        <!-- 博客標題 -->
        <div id="mypost_title">
            <div id="mypost_title_h" style="font-weight: 500;font-size: 21px;">活著</div>
            <div id="mypost_title_f">新人入坑，不定時分享一些作業中遇到的一些問題，或者覺得好的點</div>
            <div id="mypost_title_e">
                <a href="https://www.cnblogs.com/SuperBrother/"">不求人好感，不予人難堪</a>
            </div> 
        </div>  
    </div>
</div>

將下面代碼復制到 -> 頁腳 HTML 代碼

<!-- ............自定義尾部代碼開始............ -->
<div id="post-bottom-bar" >
    <div >
        <!-- 左邊 -->
        <div  style="float: left;">
          <!--  <span >
                <a id="bottom-d" href="javascript:void(0)" target="_blank">好文要贊</a>
            </span>-->
            <span  >
                <a id="bottom-g" href="https://home.cnblogs.com/u/SuperBrother/"" target="_blank">關注我</a>
            </span>
            <span class="bottom-bar-item bottom-bar-qrcode">
                <a id="bottom-s" href="javascript:void(0)" target="_blank">收藏該文</a>
            </span>
        </div>
        <!-- 右邊 -->
        <div class="bottom-bar-items right" style="float: right;">
            <span class="bottom-bar-item"><a href="https://www.cnblogs.com/SuperBrother/p/#mfooter">↓</a></span>
            <span class="bottom-bar-item"><a href="https://www.cnblogs.com/SuperBrother/p/#mtop">↑</a></span>
        </div>
    </div> 
</div>
<a name="mfooter"></a>
<!-- ............自定義尾部代碼結束............ -->
<script type="text/javascript" src="https://unpkg.com/[email protected]/nprogress.js"></script>
<script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
<script type="text/javascript">
    /**
        用來設定初始時需要執行的js
    */
    $(document).ready(function(){
        //加載頂部進度條
        NProgress.start();
        NProgress.done();
        $("#myProgressBar").hide();
        //設定背景圖片地址
        if ($("#head_bg_img").val()!=null && $("#head_bg_img").val()!="") {
            $("#myheader_bg").css("background-image","url("+$("#head_bg_img").val()+")");
        }else{
            $("#myheader_bg").css("background-image","url(http://static.oneplus.cn/data/attachment/forum/201410/18/111440yq2sp3y35mmmsmpm.jpg)");//頂部背景圖片
        }
        //標題
        $("#mypost_title_h").html($("#cb_post_title_url").html());
        //正文和標題淡入
        $("#mainContent").css("opacity","1");
        $("#mainContent").css("margin-top","0");
        $("#mypost_title").css("opacity","1");
        $("#mypost_title").css("top","75pt");
        //更改iocn圖示
        var linkObject = document.createElement("link");
        linkObject.rel = "shortcut icon";
        linkObject.href = "https://images.cnblogs.com/cnblogs_com/menxin-/1561019/o_00.png";
        document.getElementsByTagName("head")[0].appendChild(linkObject);
    })
    /**
        設定ajax請求加載完所有資料時執行的js
    */
    setTimeout(afterAjax,1000);
    function afterAjax(){
        //假如是首頁
        if (window.location.href =https://www.cnblogs.com/SuperBrother/p/="https://www.cnblogs.com/SuperBrother/"|| 
            window.location.href == "https://www.cnblogs.com/SuperBrother"||
            window.location.href == "https://www.cnblogs.com/SuperBrother"|| 
            window.location.href == "https://www.cnblogs.com/SuperBrother") {
            $("#mypost_title_f").html("新人入坑，不定時分享一些作業中遇到的一些問題，或者覺得好的點");
            $("#mypost_title_e").html("<a href='https://www.cnblogs.com/SuperBrother'>不求人好感，不予人難堪，</a>");
        }else{
            var classification = null;
            if ($("#BlogPostCategory").html()!=null && $("#BlogPostCategory").html()!= "") {
                classification = $("#BlogPostCategory").html();
                classification = classification.substring(3,classification.length);
            }else{
                classification = "<a href='https://www.cnblogs.com/menxin-/'>暫未分類</a>";
            }
            //設定副標題標題
            $("#mypost_title_f").html(ftitle);
            //設定標題分類按鈕
            $("#mypost_title_e").html(classification);
            //設定底部導航條上一篇下一篇文章
            var pnp = $("#post_next_prev a");
            $("#mbottom-left").attr("href",pnp[1].href);
            if (pnp.length>2) {
                $("#mbottom-right").attr("href",pnp[3].href);
            }
        }
        $("#myheader_bg").css("filter","blur(0px)");
    }


    /** 
        自定義的js方法
    */
    $("#bottom-s").click(function(){
        AddToWz(cb_entryId);return false;
    })
    if (window.location.href =https://www.cnblogs.com/SuperBrother/p/="https://www.cnblogs.com/SuperBrother"|| 
            window.location.href == "https://www.cnblogs.com/SuperBrother"||
            window.location.href == "https://www.cnblogs.com/SuperBrother"|| 
            window.location.href == "https://www.cnblogs.com/SuperBrother") {
    }else{
        var url = window.location.href;
        var lastUrl = url.substring(url.lastIndexOf("/")+1);
        var mpageId = lastUrl.substring(0,lastUrl.indexOf("."));
        $("#bottom-d").click(function(){
         //   DiggIt(mpageId,cb_blogId,1);
            green_channel_success(this,'謝謝推薦！');
        })
    }

    //通過滾動條控制導航條的展現隱藏
    var oldScrollNum = 0;
    window.onscroll = function(){
        var t = document.documentElement.scrollTop || document.body.scrollTop;
        //下滑
        if (t>oldScrollNum) {
            if (t>120) {
                $("#mynavbar").css("margin-top","-70px");//頂部導航
                $("#post-bottom-bar").css("bottom","-3pc");//底部導航
            }
            if (t>300) {
                $("#right_meun").css("display","inline-block");//右側導航
            }
        //上拉
        }else{
            //防止用a鏈接跳轉也觸發效果
            if (oldScrollNum-t<20) {
                $("#mynavbar").css("margin-top","0px");//頂部導航
                $("#post-bottom-bar").css("bottom","0");//底部導航
            }
            if (t<=300) {
                $("#right_meun").css("display","none");//右側導航
            }
        }
        oldScrollNum = t;
    }

    //背景大圖點擊模糊||清晰
    $("#myheader_cover").click(function(){
        if ($("#myheader_bg").css("filter") == "blur(3px)") {
            $("#myheader_bg").css("filter","blur(0px)");
        }else{
            $("#myheader_bg").css("filter","blur(3px)");
        }
    })

     //點擊圖片放大居中顯示
    layer.photos({
      photos: '#cnblogs_post_body'
      ,shift: 0
    });
 </script>

 <script type="text/javascript">  
    var setMyBlog = {
        setCopyright: function() {
            //設定著作權資訊，轉載出處自動根據頁面url生成
            var info_str = '<p>作者：<a target="_blank">@gzdaijie</a><br>'+
                '本文為作者原創，轉載請注明出處：<a ></a></p><hr></hr>', 
                info = $(info_str),
                info_a = info.find("a"),
                url = window.location.href;
            $(info_a[0]).attr("href","https://github.com/zaijianwodeai");
            $(info_a[1]).attr("href",url).text(url);
            $("#cnblogs_post_body").prepend(info);
        },
        setCodeRow: function(){
            // 代碼行號顯示
            var pre = $("pre.sourceCode"); //選中需要更改的部分
            if(pre && pre.length){
                pre.each(function() {
                    var item = $(this);
                    var lang = item.attr("class").split(" ")[1]; //判斷高亮的語言
                    item.html(item.html().replace(/<[^>]+>/g,"")); //將<pre>標簽中的html標簽去掉
                    item.removeClass().addClass("brush: " + lang +";"); //根據語言添加筆刷
                    SyntaxHighlighter.all();
                })
            }
        },
        setAtarget: function() {
            // 博客內的鏈接在新視窗打開
            $("#cnblogs_post_body a").each(function(){
                this.target = "_blank";
            }) 
        },
        setContent: function() {
            // 根據h2、h3標簽自動生成目錄
            var captions_ori = $("#cnblogs_post_body h2"),
                captions_ori2 = $("#cnblogs_post_body h3"),
                captions = $("#cnblogs_post_body h2,#cnblogs_post_body h3").clone(),
                content = $("<ul id='right_meun'></ul>");
            $("#cnblogs_post_body").prepend(content.append(captions));
            var index = -1,index2 = -1;
            captions.replaceWith(function(){
                var self = this;
                if(self.tagName == "H2" || self.tagName == "h2"){
                    // 設定點擊目錄跳轉
                    index += 1;
                    $('<a name="' + '_caption_' + index + '"></a>').insertBefore(captions_ori[index]); 
                    return '<li id="'+index+'li"><a href="https://www.cnblogs.com/SuperBrother/p/#_caption_' + index + '">' + self.innerHTML + '</a><ul></ul></li>';
                } else {
                    // add by summertime-wu 增加h3鏈接跳轉
                    index2 += 1;
                    $('<a name="' + '_caption' + index2 + '"></a>').insertBefore(captions_ori2[index2]); 
                    $("#"+index+"li ul").append("<li><a href='https://www.cnblogs.com/SuperBrother/p/#_caption" + index2 + "' style='color:#5f5f5f;'>" +self.innerHTML+"</a></li>");
                    return ;
                }
            });
        },
        runAll: function() {
            /* 運行所有方法
             * setAtarget() 博客園內標簽新視窗打開
             * setContent() 設定目錄
             * setCopyright() 設定著作權資訊
             * setCodeRow() 代碼行號顯示
             */ 
            this.setAtarget(); 
            //假如為手機端不顯示目錄
            if(document.body.clientWidth>=1000){
                this.setContent();
            }
            // this.setCopyright();
            this.setCodeRow();
        }
    }
    setMyBlog.runAll();
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array("?我愛你?","?無畏?","?人海?","?的擁擠?","?用盡?","?余生?","?的勇氣?","?只為?","?能靠近你?","?哪怕?","?一?","?厘米?","?愛上你?","?是我?","?落下?","?的險棋?","?不懼?","?歲月?","?的更替?","?往后?","?的潮汐?","?無論?","?風雨?","?是你?","?就足以?");
        var $i = $("<span></span>").text(a[a_idx]);
        a_idx = (a_idx + 1) % a.length;
        var x = e.pageX,
        y = e.pageY;
        $i.css({
            "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
            "top": y - 20,
            "left": x,
            "position": "absolute",
            "font-weight": "bold",
            "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>

<!--網頁icon圖示 -->
<script type="text/javascript" language="javascript">
　　//Setting ico for cnblogs
　　var linkObject = document.createElement('link');
　　linkObject.rel = "shortcut icon";
　　linkObject.href = "https://files-cdn.cnblogs.com/files/menxin-/20191008025811159_easyicon_net_32.ico";
　　document.getElementsByTagName("head")[0].appendChild(linkObject);
</script>

然后保存，大功告成！

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/51695.html

標籤：Html/Css

上一篇：利用vertical-align屬性實作分隔符

下一篇：Wordpress網站變灰/黑白主題