博客园博客小优化

Posted 2020-12-25 weihanli

博客园博客小优化

Fork me on Github

页首html 代码部分增加以下代码：

<a href="https://github.com/WeihanLi" target="_blank">
<img style="position: fixed; top: 0; right: 0; border: 0;z-index:233" src="https://github-camo.global.ssl.fastly.net/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png">
</a>

更多 "Fork me on Github" 样式可以在 Github 上获取

Github Ribbons

评论头像

$(".blog_comment_body").before("<div class='author-avator' style='float: left;'><a target='_blank'><img  /></a></div>");
var feedbackCon = $(".feedbackCon");
for (var i = 0; i < feedbackCon.length; i++) {
    var span = $(feedbackCon[i]).find("span:last").eq(0).html()||"http://pic.cnitblog.com/face/sample_face.gif";
    $(feedbackCon[i]).find(".author-avator img").attr("src", span);
    var href = $(feedbackCon[i]).parent().find(".comment_date").next().attr("href");
    $(feedbackCon[i]).find(".author-avator a").attr("href", href);
}

全屏阅读

这里全屏阅读的配置用了 localstorage ,这样用户设置了之后下次就会记住设置

var isFullScreenSettingKey = "isFullScreen";
//toogle fullScreen
$(".fullScreen").on("click",function () {
    var isFullScreen = localStorage.getItem(isFullScreenSettingKey);
    if(isFullScreen && isFullScreen=="1") {
        //tip
        $(".fullScreen").text("全屏阅读");
        $(".fullScreen").attr("title","全屏阅读");
        //style
        $("#mainContent").css("width", "76%");
        $("#sideBar").css("display", "block");
        //setting
        localStorage.setItem(isFullScreenSettingKey,"0");
    }else{
        //tip
        $(this).text("取消全屏");
        $(this).attr("title","取消全屏");
        //style
        $("#sideBar").css("display", "none");
        $("#mainContent").css("width", "100%");
        //setting
        localStorage.setItem(isFullScreenSettingKey,"1");
    }
});
//
var isFullScreen = localStorage.getItem(isFullScreenSettingKey);
if(isFullScreen && isFullScreen=="1") {
    //tip
    $(".fullScreen").text("取消全屏");
    $(".fullScreen").attr("title","取消全屏");
    //style
    $("#sideBar").css("display", "none");
    $("#mainContent").css("width", "100%");
}

More

占坑，以后再补充...