zoukankan      html  css  js  c++  java
  • 我cnblogs的主题

    我的cnblogs主题

    这里记录的是本博客的主题存档

    主题代码参考自:流云诸葛的博客

    博客皮肤选择

    选择 LessIsMore

    页面定制CSS代码 

    div.post div.entry {
        font-family: Georgia,"Times New Roman",Times,sans-serif;
    }
    
    div.post div.entry h1, div.post div.entry h2, div.post div.entry h3 {
        margin-top: 24px;
        margin-bottom: 12px;
    }
    
    div.post div.entry h1 {
        padding: 5px;
        color: #fff;
        background-color: gray;
    }
    
    div.post h2 {
        font-size: 22px;
        line-height: 100%;
    }
    
    div.post div.entry pre.code {
        font-family: Consolas border-style : dashed;
        border-left: solid 5px #6ce26c;
    }
    
    div#information {
        background-color: #f8f8ee;
        border: solid 1px #e8e7d0;
        padding: 5px 10px 0 10px;
        min-height: 10px;
        margin-top: -15px;
        margin-bottom: 30px;
        color: #666;
    }
    
    .cnblogs_code {
        border-left: #58CE60 5px solid!important;
        margin: 0 auto 15px;
    }
    
    .cnblogs_code + .cnblogs_code {
        margin-top: 15px;
    }
    
    /*
    #site_nav_under, #under_post_kb, #under_post_news, .c_ad_block, a[href="http://count.knowsky.com"] {
        display: none!important;
    }
    */
    
    .newsItem > .catListTitle {
        display: none;
    }
    
    #cnblogs_post_body h2 {
        line-height: 1.8;
        background-color: #ddd;
        box-shadow: 0 0 5px -1px #333;
        padding-left: 10px;
    }
    
    #MySignature {
        background-color: #FFF7DC;
        border: 2px dashed #FFBFBF;
        padding: 10px 15px;
    }
    
    .copyright-wrapper {
        padding-top: 10px;
        margin-top: 10px;
        border-top: 1px dashed #F1C7C7;
    }
    
    .copyright {
        font-size: 12px;
    }
    
    #cnblogs_post_body h2 {
        margin: 0 auto 10px;
    }
    
    #navList li a, .postBody a:hover, a {
        text-decoration: none;
    }
    
    
    
    li, ul {
        margin: 0;
        padding: 0;
    }
    
    .clearfix:after, .clearfix:before {
        display: table;
        content: '';
    }
    
    .clearfix:after {
        clear: both;
    }
    
    .clearfix {
        zoom: 1;
    }
    
    .ff-t {
        font-family: Tahoma;
    }
    
    #button_go_top {
        position: fixed;
        right: 5px;
        bottom: 75px;
        width: 70px;
        display: none;
    }
    
    #button_go_top a {
        display: inline-block;
        width: 70px;
        height:28px;
        -webkit-transition: opacity .5s ease;
        transition: opacity .5s ease;
        text-align: center;
        opacity: .7;
        color: #fff;
        margin: auto 2px;
        border-radius: 5px;
        background-color: #6da47d;
        /*background: url(http://images2015.cnblogs.com/blog/459873/201603/459873-20160318143006349-1431534918.png) -608px -188px no-repeat;*/
        filter: alpha(opacity=70);
    }
    
    #button_go_top li {
        float: left;
    
        /*display: none;*/
        overflow: hidden;
    }
    
    #button_go_top a:hover {
        color: #fff;
        background-color: #55895b;
        opacity: 1;
        filter: alpha(opacity=70);
    }
    
    body, ul {
        padding: 0;
    }
    
    body {
        font-family: '微软雅黑','宋体',Arial;
        font-size: 15px;
        margin: 0;
        /* background: #e7e7e7 url(http://images2015.cnblogs.com/blog/459873/201603/459873-20160316135102787-1112392588.png) 0 0 repeat; */
        /* padding: 0 40px; */
    }
    
    #home {
        overflow: auto;
        /* margin: 40px auto 50px auto; */
        /* border-radius: 10px; */
        background: #fff;
        box-shadow: 0 0 10px -4px #4E4E4E;
        filter: alpha(opacity=90);
    }
    
    .postBody p, .postCon p {
        line-height: 24px;
        margin: 7px 0;
    }
    
    ul {
        margin: 0;
        list-style: none;
    }
    
    image {
        border: none;
    }
    
    #blogTitle .title {
        font-size: 36px;
        line-height: 100px;
        height: 100px;
        padding-left: 60px;
    }
    
    #navigator, .blogStats {
        height: 48px;
    }
    
    .blogStats{
        margin-right: 30px;
    }
    
    .subtitle {
        font-size: 14px;
        font-weight: 400;
        margin: 10px 0;
        padding-left: 30px;
        color: #999;
    }
    
    #navList li a, .blogStats {
        line-height: 48px;
        color: #fff;
    }
    
    #navigator {
        font-size: 16px;
        margin-top: 20px;
        margin-bottom: 0;
        border: none;
        text-align: center;
        background: #55895b;
        box-shadow: 0 -1px 12px -4px #000;
        padding-top: 0;
    }
    
    #navList li {
        line-height: 46px;
        display: inline-block;
        float: left;
        margin: 0;
    }
    
    #navList li:hover {
        background: #6da47d;
    }
    
    #navList li a {
        display: -moz-inline-box;
        display: inline-block;
        padding: 0 30px;
        border: 0;
    }
    
    .postTitle, .postTitle a {
        color: #464646;
    }
    
    .post .postTitle{
        border-bottom: solid 1px #55895b !important;
        margin-bottom: 30px;
    }
    
    .post .postTitle a:before {
        content: '' !important; 
    }
    
    #main {
        padding: 25px 10px 10px 260px;
        background: url(http://images2015.cnblogs.com/blog/459873/201603/459873-20160316173132162-205254894.png) left top repeat-y #fff;
    }
    
    #sideBarMain {
        font-size: 12px;
        line-height: 22px;
        width: 210px;
        margin: 0;
        padding: 0 10px 0 0;
    }
    
    #mainContent, .day {
        padding: 0;
        background: #fff;
    }
    
    #sideBar {
        float: left;
        margin-left: -100%;
        position: relative;
        left: -260px;
        width: 210px;
        padding: 0 0 0 30px;
    }
    
    #profile_block {
        line-height: 24px;
        text-align: left;
    }
    
    #mainContent {
        float: left;
        margin: 0;
        overflow: auto;
        max-width: 100%;
    }
    
    .day {
        margin: 0 0 20px;
    }
    
    .postTitle {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        padding-bottom: 10px;
        border-bottom: none;
    }
    
    .dayTitle {
        display: none;
    }
    
    .c_b_p_desc {
        font-size: 14px;
        line-height: 24px;
        padding: 20px;
        color: #888;
        border-radius: 12px;
        background: #f0f0f0;
        -ms-border-radius: 10px;
    }
    
    #topics .post, .postDesc {
        background: #fff;
    }
    
    .c_b_p_desc a {
        color: #888;
    }
    
    #sidebar_search .catListTitle {
        display: none;
    }
    
    .postDesc, .postDesc a {
        color: #aaa;
    }
    
    .desc_img {
        margin-left: 10px;
        border: 1px solid #fff;
        box-shadow: 0 0 10px #aaa;
    }
    
    .postDesc {
        font-size: 12px;
        margin: 0 0 2px;
        padding: 8px 0;
        text-align: right;
    }
    
    #div_digg, #footer {
        text-align: center;
    }
    
    .btn_my_zzk, .comment_btn {
        cursor: pointer;
        vertical-align: middle;
        color: #fff;
        display: inline-block;
        font-family: 'Microsoft Yahei';
    }
    
    .postBody {
        padding: 0;
    }
    
    
    .btn_my_zzk {
        font-size: 14px;
        position: relative;
        width: 60px;
        height: 26px;
        padding: 1px;
        border: none;
        border-radius: 4px;
        background: #55895b;
    }
    
    .btn_my_zzk:hover {
        background: #6da47d;
    }
    
    .diggit{
        padding: 0;
        width: 45px;
        height: 50px;
        margin: 0;
        float: left;
        border: 2px solid #6da47d;
        border-radius: 5px;
    }
    
    .buryit{
        padding: 0;
        width: 45px;
        height: 50px;
        float: left;
        margin: 0;
        margin-top: 10px;
        border-radius: 5px;
        border: 2px solid #6da47d;
    }
    
    
    #div_digg {
        position: fixed;
        right: 180px;
        bottom: 20px;
        z-index: 9999;
        background-color: transparent;
        font-size: 12px;
        width: 45px !important;
        margin: 10px 0 0;
        padding: 5px;
        /* border: 1px solid #55895b; */
        /* border-radius: 5px; */
    }
    
    
    #btn_comment_submit, .comment_btn {
        width: 120px;
        height: 48px;
        border: none;
    }
    
    #digg_tips {
        display: none;
    }
    
    .comment_btn {
        font-size: 18px;
        position: relative;
        background: #55895b;
    }
    
    #commentform_title, .feedback_area_title {
        font-weight: 700;
        border-bottom: solid 6px #55895b;
    }
    
    #btn_comment_submit:hover {
        background: #6da47d;
    }
    
    .feedback_area_title {
        font-size: 24px;
        padding: 10px;
        color: #55895b;
    }
    
    .feedbackListSubtitle {
        font-size: 12px;
        color: #888;
    }
    
    .feedbackListSubtitle a {
        color: #888;
    }
    
    #commentform_title {
        font-size: 24px;
        margin-bottom: 10px;
        padding: 10px 20px 10px 10px;
        color: #55895b;
        background-image: none;
        background-repeat: no-repeat;
    }
    
    #green_channel, .feedbackListSubtitle {
        font-weight: 400;
    }
    
    #comment_form {
        margin: 10px 0;
        padding: 0;
    }
    
    .commentform {
        margin: 10px 0;
        padding: 10px 20px;
        background: #fff;
    }
    
    #tbCommentBody {
        font-size: 14px;
        line-height: 1.42857143;
        width: 940px;
        height: 200px;
        padding: 5px 12px;
        -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
        color: #3c763d;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    }
    
    .feedbackItem {
        font-size: 14px;
        line-height: 24px;
        margin: 10px 0;
        padding: 20px;
        background: #f2f2f2;
        box-shadow: 0 0 5px #aaa;
    }
    
    #footer {
        font-size: 12px;
        font-size: 14px;
        margin: 20px;
        padding: 12px;
        color: #ddd;
        background: #55895b;
        display: none;
    }
    
    .First, .demo {
        text-align: left;
    }
    
    .catListTitle {
        padding: 5px;
        border: 1px solid #eee;
        border-left-width: 5px;
        border-left-color: #55895b;
        border-radius: 3px;
        background-color: #fff;
        /* background-color: #55895b;
        color: #fff; */
    }
    
    /* .catListTitle {
        border-top-color: #CECECE;
        border-right-color: #CECECE;
        border-bottom-color: #CECECE;
    } */
    
    #green_channel {
        font-size: 15px;
        width: 920px;
        padding: 20px;
        color: #fff;
        border: none;
        border-radius: 4px;
        background: #6da47d;
    }
    
    code {
        padding: 2px 4px;
        white-space: nowrap;
        color: #d14;
        border: 1px solid #e1e1e8;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        background-color: #f7f7f9;
    }
    
    kbd {
        font-family: Arial,Helvetica,sans-serif;
        font-size: 11px;
        line-height: 1.4;
        display: inline-block;
        margin: 0 .1em;
        padding: .1em .6em;
        color: #333;
        border: 1px solid #ccc;
        border-radius: 3px;
        background-color: #f7f7f7;
        box-shadow: 0 1px 0 rgba(0,0,0,.2),0 0 0 2px #fff inset;
        text-shadow: 0 1px 0 #fff;
    }
    
    .headph:hover img {
        -webkit-transform: rotate(360deg) scale(1.5);
        transform: rotate(360deg) scale(1.5);
    }
    
    .headph img {
        width: 48px;
        height: 48px;
        -webkit-transition: all 1s ease-in-out;
        transition: all 1s ease-in-out;
    }
    
    .Abstract {
        font-family: 'Microsoft Yahei';
        padding: 15px;
        color: #999;
        border: 2px dotted #999;
        border-radius: 4px;
    }
    
    .First, .Second {
        margin: 10px 0;
        color: #fff;
        padding: 6px 20px;
        font-family: 'Microsoft Yahei';
    }
    
    .First, .Second, .Third, .demo {
        clear: both;
        border-radius: 4px;
    }
    
    .First {
        font-size: 20px;
        background: #55895b;
    }
    
    .Second {
        font-size: 18px;
        background: #93c8a2;
    }
    
    .Third {
        font-family: 'Microsoft Yahei';
        font-size: 16px;
        margin: 15px 0;
        padding: 6px 20px;
        color: #999;
        background: #c6efd2;
    }
    
    .note {
        font-family: 'Microsoft Yahei';
        font-size: 15px;
        clear: both;
        margin: 10px 0;
        padding: 15px 20px 15px 60px;
        box-shadow: 0 0 8px #aaa;
    }
    
    .demo {
        font-size: 16px;
        overflow: auto;
        padding: 6px 20px;
        color: #fff;
        background: orange;
    }
    
    .syntaxhighlighter .line.alt2 {
        background-color: #fff!important;
    }
    
    div#blog-comments-placeholder a:hover, div#comment_form a:hover, div#profile_block a:hover, div.catList a:hover, div.catListBlogRank a:hover, div.catListFeedback a:hover, div.catListImageCategory a:hover, div.catListLink a:hover, div.catListPostArchive a:hover, div.catListPostCategory a:hover, div.catListView a:hover, div.catListTag, div.catListEssay a:hover {
        color: #55895b;
    }
    
    #BlogPostCategory a, #LauncherLogoLink:hover, #RecentCommentsBlock a, #topics a:hover {
        padding: 1px 3px;
        text-decoration: none;
        color: #fff;
        border-radius: 3px;
        background-color: #55895b;
    }
    
    /*
    
    .catListTag a {
        padding: 1px 3px;
        text-decoration: none;
        color: #fff;
        border-radius: 3px;
        background-color: #55895b;
    }
    
    .catListTag a:visited, a:hover {
        color: #464646;
    }
    
    */
    
    a, a:hover, a:visited {
        color: #464646;
    }
    
    h1 {
        margin: 0;
    }
    
    h3 {
        font-size: 15px;
        font-weight: 700;
    }
    
    .postBody .First a {
        color: #fff;
    }
    
    .postBody a:hover {
        color: #fff;
        background-color: #55895b;
    }
    
    .postBody a {
        padding: 1px 3px;
        color: #55895b;
    }
    
    #cnblogs_post_body img {
        max-width: 100%!important;
        /*border: 1px solid #CCCCCC;*/
        border-radius: 4px!important;
        /*border: 1px solid #55895B!important;
        padding: 20px!important;
        border-radius: 5px!important;*/
        box-sizing: border-box!important;
        box-shadow: -4px 0 8px #CCCCCC,0 -4px 8px #CCCCCC,0 4px 8px #CCCCCC,4px 0 8px #CCCCCC;
    }
    
    #cnblogs_post_body .cnblogs_code_copy img {
        border: none!important;
        padding: 0!important;
        border-radius: 0!important;
    }
    
    .forFlow {
        margin: 0 20px 0 20px;
    }
    
    #navList li a {
        font-size: 16px;
        font-weight: 700;
    }
    
    #calendar table {
        width: 100%;
    }
    
    #blogCalendar u {
        text-align: center;
        color: #55895B;
        display: block;
        padding: 0 2px;
        font-size: 1.1em;
        font-weight: 700;
        margin-top: 2px;
    }
    
    input[type=button].btn_my_zzk {
        width: 60px;
    }
    
    #blogTitle .title {
        position: relative;
        background: 0 0;
    }
    
    .portrait {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100px;
        height: 100px;
        border-radius: 50px;
        overflow: hidden;
        background: #fff url(http://pic.cnblogs.com/avatar/459873/20150917085709.png) no-repeat left center;
        background-size: contain;
    }
    
    #topics a:hover {
        padding: 1px 3px 1px 3px;
        text-decoration: none;
        color: #018ee8;
        border-radius: none;
        background-color: transparent;
    }
    
    .postTitle {
        padding-left: 0;
        background: 0 0;
    }
    
    .subtitle {
        padding-left: 0;
    }
    
    #blogTitle {
        padding-bottom: 0;
    }
    
    #nav_ing, #nav_newpost, #nav_q {
        display: none!important;
    }
    
    #sideBar {
        border-width: 0!important;
    }
    
    #sideBarMain {
        margin: 0;
        padding: 0;
    }
    
    
    
    #green_channel {
        width: auto;
    }
    
    #tbCommentBody {
        width: 100%;
        display: block;
        box-sizing: border-box;
    }
    
    #div_digg {
        width: 46px;
        bottom: 110px;
    }
    
    
    
    #div_digg {
        right: 5px;
    }
    
    #tbCommentBody {
        background: 0 0;
    }
    
    span[id^=cnzz_stat_icon] {
        position: fixed;
        bottom: 0;
        right: 0;
    }
    
    .newsItem {
        padding: 5px 10px;
        /* border: 1px solid #55895B; */
        /* border-top- 5px; */
        border-bottom: none;
        border-top-left-radius: 14px;
        border-top-right-radius: 14px;
    }
    
    #MyIng .ing_title, #sideBar h3 {
        margin: 10px 0;
        border: 1px solid #55895B;
        border-left-width: 5px;
        border-right-width: 5px;
        border-radius: 10px;
        text-align: center;
    }
    
    #calendar {
        margin-top: 0;
        text-align: center;
       /* border: 1px solid #55895B; */
        /* padding: 5px; */
        border-radius: 14px;
        /*border-bottom-left-radius: 14px;*/
        /*border-bottom-right-radius: 14px;*/
        /* border-bottom- 5px; */
        /* margin-bottom: 25px; */
    }
    
    .postTitle a:before {
        content: '~ ';
    }
    
    .postTitle a:hover {
        color: #55895B;
    }
    
    .postTitle a:hover:before {
        color: #55895B;
    }
    
    #navCategory {
        background-color: #ddd;
        padding: 10px;
        border-radius: 10px;
    }
    
    @-webkit-keyframes swing {
        20% {
            -webkit-transform: rotate3d(0,0,1,15deg);
            transform: rotate3d(0,0,1,15deg);
        }
    
        40% {
            -webkit-transform: rotate3d(0,0,1,-10deg);
            transform: rotate3d(0,0,1,-10deg);
        }
    
        60% {
            -webkit-transform: rotate3d(0,0,1,5deg);
            transform: rotate3d(0,0,1,5deg);
        }
    
        80% {
            -webkit-transform: rotate3d(0,0,1,-5deg);
            transform: rotate3d(0,0,1,-5deg);
        }
    
        to {
            -webkit-transform: rotate3d(0,0,1,0deg);
            transform: rotate3d(0,0,1,0deg);
        }
    }
    
    @keyframes swing {
        20% {
            -webkit-transform: rotate3d(0,0,1,15deg);
            transform: rotate3d(0,0,1,15deg);
        }
    
        40% {
            -webkit-transform: rotate3d(0,0,1,-10deg);
            transform: rotate3d(0,0,1,-10deg);
        }
    
        60% {
            -webkit-transform: rotate3d(0,0,1,5deg);
            transform: rotate3d(0,0,1,5deg);
        }
    
        80% {
            -webkit-transform: rotate3d(0,0,1,-5deg);
            transform: rotate3d(0,0,1,-5deg);
        }
    
        to {
            -webkit-transform: rotate3d(0,0,1,0deg);
            transform: rotate3d(0,0,1,0deg);
        }
    }
    
    #blogTitle .title > a > .name {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }
    
    #blogTitle .title > a:hover > .name {
        -webkit-transform-origin: top center;
        transform-origin: top center;
        -webkit-animation-name: swing;
        animation-name: swing;
    }
    
    #green_channel a:hover {
        padding: 3px 8px;
    }
    
    #header {
        /*background: url(http://tse1.mm.bing.net/th?id=OIP.M6a036c918eca65bdb4cef1fb88a5f645H0&pid=15.1) right top no-repeat;*/
        background: url(https://octodex.github.com/images/octobiwan.jpg) right top no-repeat;
        /*background-color: #F0F2EF;*/
        background-color: #fff;
        background-size: auto 75%;
    }
    
    #cnblogs_post_body p {
        margin: 12px auto;
        font-size: 14px;
    }
    
    .sticky--in-top {
        position: fixed!important;
        z-index: 1000!important;
        padding: 15px 0 15px 18px!important;
        margin-left: 0!important;
        background: #fff!important;
        border-bottom-left-radius: 10px;
    }
    
    .cnblogs_code_copy a img {
        display: none;
    }
    
    .cnblogs_code_toggle a.cnblogs_code_toggle_trigger {
        color: #00f;
        display: inline-block;
        border: 1px solid #CCC!important;
    }
    
    /*.cnblogs_code pre {
        display: none;
    }*/
    
    .cnblogs_code pre.active {
        display: block;
    }
    
    /*to keep the insert code open/close buttons sytle*/
    #cnblogs_post_body .code_img_closed {
        padding: 0px !important;
        border-style: none !important;
        border-radius: 0px !important;
        box-shadow: none; !important;
    }
    
    #cnblogs_post_body .code_img_opened {
        padding: 0px !important;
        border-style: none !important;
        border-radius: 0px !important;
        box-shadow: none; !important;
    }
    
    #my-comment {
    }
    
    #my-copyleft {
        border-top: 1px dashed #F1C7C7;
        margin-top: 5px;
        padding-top: 5px;
    }
    
    a {
        border-style: none !important;
    }
    
    blockquote {
        background-color: rgb(245, 245, 245);
        border: none;
        border-left-color: rgb(204, 204, 204);
        border-left-style: solid;
        border-left-width: 5px;
        color: rgb(68, 68, 68);
        display: block;
        text-shadow: rgba(0, 0, 0, 0) 0px 0px 1px;
    }
    
    #sidebar_search_box{
        margin: 20px 0;
    }
    
    input.btn_my_zzk {
        font-size: 16px;
        height: 32px;
        margin-left: 5px;
    }
    
    #google_q, #q {
        font-size: 16px;
        width: 120px;
        border: 1px solid #ccc;
        height: 30px;
        line-height: 28px;
        padding: 0 5px;
        border-radius: 4px;
    }
    
    @media (max- 768px) {
        body {
            font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif
        }
    
        #green_channel {
            width: auto !important;
        }
    
        #ad_t2, #nav_admin, #nav_contact, #sideBar, .blogStats, .git-link, .postDesc a[rel=nofollow], .topicListFooter {
            display: none !important
        }
    
        #div_digg, #button_go_top {
            opacity: .9
        }
    
        #button_go_top a {
            height:25px;
        }
    
        body {
            padding: 0 !important;
        }
    
        #home {
            border-radius: 0 !important;
            margin: 0 !important
        }
    
        #header {
            background-image: none !important
        }
    
        #main {
            padding: 15px 10px;
            background-image: none
        }
    
        #mainContent {
            overflow: hidden !important
        }
    
        .forFlow {
            margin: 8px !important
        }
    }
    View Code

    页首Html代码

    <a href="https://github.com/keitsi" target="new">
        <img style="position: absolute; top: 0; left: 0; border: 0;" src="http://images2015.cnblogs.com/blog/459873/201603/459873-20160317090540131-1089895320.png" alt="Fork me on GitHub" />
    </a>

    侧边公告栏

    需要申请,可以插入自己的javascript,可用于支持网站流监控、个性化页面:

    下面是【返回顶部】按钮的javascript代码:

    <div id="introduce" >
    ~本博客记录了工作中遇到问题的解决方案和一些经验的分享,希望可以帮助到遇到同样问题的人。
    </div>
    <script>
        /* 百度统计 */
    
        /* 返回顶部 */
        var BackTop = function(domE, distance) {
            if (!domE) return;
    
            var AddListener = function(domE, type, fn) {
                if (typeof domE.addEventListener === 'function') {
                    AddListener = function(domE, type, fn) {
                        domE.addEventListener(type, fn, false);
                    };
                } else if (typeof el.attachEvent === 'function') {
                    AddListener = function(domE, type, fn) {
                        domE.attachEvent('on' + type, fn);
                    };
                } else {
                    AddListener = function(domE, type, fn) {
                        var old = el['on' + type];        
                        el['on' + type] = function(){
                            typeof old === 'function' && old.apply(this, arguments);
                            typeof fn === 'function' && fn.apply(this, arguments);
                        };
                    };
                }
                AddListener(domE, type, fn);
            }
    
            AddListener(window, 'scroll', throttle(function() {
                toggleDomE();
            }, 100));
    
            AddListener(domE, 'click', function() {
                window.scrollTo(0,0);
            })
    
            toggleDomE();
            function toggleDomE() {
                domE.style.display = (document.documentElement.scrollTop || document.body.scrollTop) > (distance || 500) ? 'block' : 'none';
            }
    
            function throttle(func, wait) {
                var timer = null;
                return function() {
                    var self = this,
                        args = arguments;
                    if (timer) clearTimeout(timer);
                    timer = setTimeout(function() {
                        return typeof func === 'function' && func.apply(self, args);
                    }, wait);
                }
            }
        };
    
        new BackTop(document.getElementById('button_go_top'))
    </script>

    页脚html代码

    下面是【返回顶部】按钮的html代码(需要侧边公告栏的支持):

    <div id="button_go_top">
        <ul class="clearfix">
            <li style="display: block;">
                <a href="javascript:;" title="想了解本主题请查看随笔:我cnblogs的主题" >返回顶部</a>
            </li>
        </ul>
    </div>

    个性签名

    打开博客管理 -> 博客签名

    添加一个签名:

    <div id="my-comment">Keep it simple!</div>
    <div id="my-copyleft">
        <div>作者:<a href="http://www.cnblogs.com/keitsi/" target="_blank">KEITSI</a></div>
        <div>出处:<a href="http://www.cnblogs.com/keitsi/" target="_blank">http://www.cnblogs.com/keitsi/</a></div>
        <div>知识共享,欢迎转载。</div>
    </div>
  • 相关阅读:
    算法的学习 — 冒泡排序
    自定义UICollectionLayout布局 —— UIKit之学习UICollectionView记录一《瀑布流》
    HDU 1541 Stars (线段树||树状数组)
    HDU 1617 Phone List (排序||字典树)
    CSU 1312 CX and girls (最短路)
    CSU 1320 Scoop water (卡特兰数)
    POJ 1838 Banana (并查集)
    POJ 1837 Balance (DP)
    POJ 1088 滑雪 (记忆化搜索)
    TYVJ 1261 可达总数 (BFS)
  • 原文地址:https://www.cnblogs.com/keitsi/p/5319679.html
Copyright © 2011-2022 走看看