zoukankan      html  css  js  c++  java
  • 博客园博客小优化

    博客园博客小优化

    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

    占坑,以后再补充...

  • 相关阅读:
    什么是BFC?
    获取JavaScript对象的键值对两种方法的不同之处
    浏览器什么时候会引起reflow,应该怎样避免reflow的开销呢?
    用js实现跳转页面的方法
    停止animate动画和判断是否处于动画状态
    解决slideDown(),slideUp()鼠标来回进入的问题
    IE7浏览器绝对定位被下边元素遮挡问题解决办法
    前端开发面试要点及对策
    inline-block元素之间空白间距的解决办法
    web前端开发和移动前端开发的本质区别在哪里?
  • 原文地址:https://www.cnblogs.com/weihanli/p/9379118.html
Copyright © 2011-2022 走看看