隐藏侧栏

第一套自定义主题

博客皮肤:Simplified

定制CSS

#ad_t2, #opt_under_post, #cnblogs_c1, #under_post_card1, #cnblogs_c2, #under_post_card2, HistoryToday, green_channel { display: none; }
#top_nav, #blog_post_info, #author_profile, #div_digg, #comment_form_container { display: none; }
#home {
    margin: 0 auto;
    //opacity: 0.85;
    opacity: 1;
    width: 65%;
    min-width: 950px;
    background-color: #fff;
    padding: 30px;
    margin-top: 50px;
    margin-bottom: 50px;
    box-shadow: 0 2px 6px rgb(100 100 100 / 30%);
}
body {
    color: #000;
    background-color: #e6e6e6;
    font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
    font-size: 12px;
    min-height: 101%;
    //background: url(https://images.cnblogs.com/cnblogs_com/smiller/2004889/o_2107260123121.jpg) fixed;
    background-color: #DCDCDC;
    background-size: 100% 100%;
}

侧边栏

<script type="text/javascript">
    //Date: 2013-02-22
    //Author: wintys (wintys@gmail.com)
    //Description:隐藏博客园(cnblogs)中个人博客的侧边栏等。在博客设置中添加如下代码即可。
    //Key Words:JS、CSS、显示、隐藏、DIV
    var obj=document.getElementById("sideBar");
    var obj_switch=document.getElementById("w_sidebar_switch");    
    var mainContent=document.getElementById("mainContent");
    var forFlow=mainContent.firstChild.nextSibling;

    //显示/隐藏DIV
    obj_switch.onclick=function (){
        if(obj.style.display=="none"){
            obj.style.display="block";
            obj_switch.innerHTML="隐藏侧栏";

            mainContent.style.marginLeft="-250px";
            forFlow.className="forFlow";
            forFlow.style.margin=" 0px 16px 0px 266px";
        }
        else{
            obj.style.display="none";
            obj_switch.innerHTML="显示侧栏";
            
            mainContent.style.marginLeft="16px";
            forFlow.className="";//需要清空class,直接设margin不起效果。
            forFlow.style.margin="0px 16px";
        }
    }
</script>

页首HTML代码

<div id="w_sidebar_switch" style="cursor: pointer; position: absolute; top: 140px; right: 300px">隐藏侧栏</div>

总之根据标签ID隐藏了广告和不需要的栏目,参照前人脚本设定了侧栏的隐藏,至于背景,本来设了彩图跟透明度,发现阅读效果不是很好,又选了自认为高级的纯色作背景,算是折中取舍。

 

posted @ 2021-08-25 16:06  S'Miller  阅读(35)  评论(0)    收藏  举报