首页 > 代码库 > 博客设置

博客设置

皮肤:BlackLowKey.

CSS:

技术分享
  1 /*背景*/  2 body {  3     font-size:16px;/*字体大小*/  4     padding:0;  5     margin:0;  6     font-family:Roboto,helvetica,sans-serif;  7     background: url(‘https://ooo.0o0.ooo/2017/04/30/5905a5c11e331.jpg‘) no-repeat fixed top;  8 /*or use link: ‘https://ooo.0o0.ooo/2017/04/30/5905a5c11e331.jpg‘*/  9 } 10 #home{ 11     width:1205px; 12 } 13 #sideBarMain{ 14     width:350px; 15     margin-top:-10px; 16     background-color:#fff; 17     opacity:0.75; 18 } 19 #topics { 20     opacity: 0.55;/*不透明度,取值范围0-1,越小背景越清晰,字体越不清晰*/ 21     margin:5px; 22     width:auto; 23     overflow:auto; 24     background:#fff; 25 } 26 #home,#main,#mainContent 27 { 28    background:transparent!important; 29 } 30 /*选中的效果*/ 31 ::selection 32 { 33     background: #66ffcc; 34     color: #83a; 35 } 36 ::-moz-selection 37 { 38      background: #66ffcc; 39      color: #83a; 40 } 41 /*评论框Orz,摘自某dalao的blog,终于能用了!*/ 42 #tbCommentBody 43 { 44     background:#fff; 45     opacity:0.95; 46     color: #fff; 47     width: 800px; 48     min-height: 20em; 49     padding: 5px; 50     border: none; 51     background: url("http://images.cnblogs.com/cnblogs_com/frantic1048/619148/o_kawai_mao.png") right bottom no-repeat; 52     background-color: #4a4a4a; 53     -webkit-transition: box-shadow .5s; 54     border: #ccc 1px solid; 55     border-color: #bbb; 56     font-size:24px; 57 } 58 /*评论按钮*/ 59 .comment_btn { 60     padding: 5px 10px; 61     height: 35px; 62     width: 90px; 63     border: 0 none; 64     border-radius: 5px; 65     background: #ddd; 66     color: #999; 67     cursor: pointer; 68     font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋体, Arial, sans-serif; 69     text-shadow: 0 0 1px #fff; 70     display: inline !important; 71     background:#66ffcc; 72     color:#FFFFFF; 73     border-radius: 3px; 74     -moz-border-radius: 3px; 75     -webkit-border-radius: 3px; 76     -webkit-transition: all 0.4s ease; 77     -moz-transition: all 0.4s ease; 78     -o-transition: all 0.4s ease; 79     -ms-transition: all 0.4s ease; 80     transition: all 0.4s ease; 81     cursor: pointer; 82     display: inline-block; 83     vertical-align: middle; 84     outline: none; 85     text-decoration: none; 86  87 } 88 #btn_comment_submit:hover { 89 background:#66ccff; 90 } 91 /*以下内容移植自萌娘百科,需要时请手动修改文字的HTML标签为<span class="heimu">...</span>方可正常使用*/ 92 /*可选参数:<... title="你知道的太多了">提示“你知道的太多了”*/ 93 .heimu{ 94     color:black; 95     background-color:black; 96 } 97 .heimu:hover{ 98     color:white; 99 }100 /*AdBlock*/101 #ad_t2,cnblogs_c1,under_post_news,cnblogs_c2,cnblogs_c2,under_post_kb,HistoryToday102 {103     display:none!important;104 }105 .c_ad_block106 {107     display:none!important;108 }109 #comment_nav110 {111    display:none!important;112 }113 /*相册*/114 .gallery115 {116     opacity:0.95;117 }118 /*框架布局*/119 #mainContent{120     width:850px;121 }122 /*首页*/123 .day{124     background:#fff;125     opacity:0.75;126     border-radius: 3px;127     -moz-border-radius: 3px;128     -webkit-border-radius: 3px;129     -webkit-transition: all 0.4s ease;130     -moz-transition: all 0.4s ease;131     -o-transition: all 0.4s ease;132     -ms-transition: all 0.4s ease;133     transition: all 0.4s ease;134     margin: 5px;135 }136 /*隐藏破坏排版的东西*/137 #homepage_top_pager138 {139     display:none!important;140 }141 /*调整签名*/142 #blogTitle h2143 {144     margin-top:0;145     margin-left:3em;146 }
糟糕的CSS

JS(放到页脚Html代码里):

技术分享
 1 <script type="text/javascript"> 2 window.console&&console.log("页脚调整...暂留"); 3 $(function(){ 4 setTimeout(function(){ 5  6 function (result) { 7     var arr = result.pic; 8     var imgSrc= http://www.mamicode.com/arr[~~(Math.random() * arr.length)].linkurl; 9 var postEle=$(".post").filter(function(){return $(this).height()>500;});10 var imgContent=‘<div style="overflow:hidden;position: absolute;display:inline-block;right: 0;bottom: 0;transition:0.5s;-webkit-transition:0.5s;-moz-transition:0.5s;"><img onl oad="setPosition(this)" src="http://www.mamicode.com/‘+imgSrc+‘" style="width:70%;height:70%;opacity:0.8;"></div>‘;11 postEle.append(imgContent);12 }, "json");13 },500);14 });15 function setPosition(obj){16 var imgBox=$(obj).parent();17 var offWid=-imgBox.width()*0.3;18 imgBox.css("right",offWid+"px");19 }20 window.console&&console.log("包装bootbox方法");21 function makeDialog(title,msg,callback,seconds){var secTimer;bootbox.dialog({title:title?title:"",message:msg,onEscape:function(){clearInterval(secTimer);callback()},buttons:{sec:{label:"在"+seconds+"秒后自动关闭",callback:function(){clearInterval(secTimer);callback()}},btn:{label:"确定",className:"btn-danger",callback:function(){clearInterval(secTimer);callback()}}}});secTimer=setInterval(function(){seconds--;if(seconds<0){clearInterval(secTimer);bootbox.hideAll();callback();return}$("button[data-bb-handler=‘sec‘]").html("在"+seconds+"秒后自动关闭")},1000)};22 23 window.console&&console.log("调整SyntaxHighlighter行号高度");24 $(function(){25 setTimeout(function(){26 var gutterArr=$(".syntaxhighlighter .gutter>.line");27 var codeArr=$(".syntaxhighlighter .code>.container>.line");28 $.each(codeArr,function(index){29 gutterArr.eq(index).attr("style","height:"+$(this).height()+"px !important");30 });},1000);31 });32 33 34 window.console&&console.log("回到顶部");35 $(".btn_goTop").click(function(){$(this).children("span").addClass("h");$("html, body").animate({scrollTop:0},600,function(){$(".btn_goTop").children("span").removeClass("h")})}).mouseover(function(){});$("#goTop .btn_goTop").mouseenter(function(){$(this).children("span").css("top","-40px")});$("#goTop .btn_goTop").mouseleave(function(){$(this).children("span").css("top","-30px")});$(window).scroll(function(){if($(document).scrollTop()>1000){$("#goTop").fadeIn(400)}else{$("#goTop").fadeOut(400)}});36 37 38 39 /*$(".louzhu").parent("h4").next().after(‘<img src="http://pic.cnblogs.com/avatar/708426/20160111191553.png" style="float:left;" class="author_avatar" alt="这个是楼主">‘);*/40 //添加幸运闪41 window.console&&console.log("添加幸运闪");42 $(".blog_comment_body").append(‘<img src="http://static.cnblogs.com/images/ing_lucky.png" class="ing_icon_lucky" alt="[幸运闪]" title="这是幸运闪">‘);43 },200)};44  //评论头像 end...45 //评论框水印+调整页脚46 if(option.url.indexOf("CommentForm")>-1){setTimeout(function(){window.console&&console.log("评论框水印");$("#tbCommentBody").attr("placeholder","......骚年哟,既然都来了,为何不吐槽几句呢 (σ?∀?)σ")},200)};47 //评论框水印 end...48 }); //ajaxComplete end...49 50 51 window.console&&console.log("**********【问题解决!!!尽量不要引用外部js】***********");52 </script>53 <!--PageEndHtml Block End-->54 <!--PageEndHtml Block End--><div id="goTop" style="display: block;">55     <div class="btn_goTop">56         <span class="" style="top: -30px;"></span>57         <a href="javascript:void(0);" title="回顶部"></a>58     </div>59 </div>60 <script type="text/javascript">61 window.console&&console.log("页脚调整...暂留");62 63 window.console&&console.log("调整SyntaxHighlighter行号高度");64 $(function(){65 setTimeout(function(){66 var gutterArr=$(".syntaxhighlighter .gutter>.line");67 var codeArr=$(".syntaxhighlighter .code>.container>.line");68 $.each(codeArr,function(index){69 gutterArr.eq(index).attr("style","height:"+$(this).height()+"px !important");70 });},1000);71 });72 73 74 window.console&&console.log("回到顶部");75 $(".btn_goTop").click(function(){$(this).children("span").addClass("h");$("html, body").animate({scrollTop:0},600,function(){$(".btn_goTop").children("span").removeClass("h")})}).mouseover(function(){});$("#goTop .btn_goTop").mouseenter(function(){$(this).children("span").css("top","-40px")});$("#goTop .btn_goTop").mouseleave(function(){$(this).children("span").css("top","-30px")});$(window).scroll(function(){if($(document).scrollTop()>1000){$("#goTop").fadeIn(400)}else{$("#goTop").fadeOut(400)}});76 77 78 $(document).ajaxComplete(function(event, xhr, option) {79 //评论头像80 if(option.url.indexOf("GetComments")>-1){setTimeout(function(){window.console&&console.log("添加评论头像");81 $.each($(".blog_comment_body"),function(index,ele){82    var self=$(ele);83    var id=self.attr("id").split("_")[2];84    var imgSrc=http://www.mamicode.com/$("#comment_"+id+"_avatar").html()||"http://pic.cnblogs.com/avatar/simple_avatar.gif";85    self.before(‘<img src="http://www.mamicode.com/‘+imgSrc+‘" style="float:left;" class="author_avatar">‘);86 });87 //添加幸运闪88 window.console&&console.log("添加幸运闪");89 $(".blog_comment_body").append(‘<img src="http://static.cnblogs.com/images/ing_lucky.png" class="ing_icon_lucky" alt="[幸运闪]" title="这是幸运闪">‘);90 },200)};91  //评论头像 end...92 //评论框水印+调整页脚93 if(option.url.indexOf("CommentForm")>-1){setTimeout(function(){window.console&&console.log("评论框水印");$("#tbCommentBody").attr("placeholder","......骚年哟,既然都来了,为何不吐槽几句呢 (σ?∀?)σ")},200)};94 //评论框水印 end...95 }); //ajaxComplete end...96 97 98 window.console&&console.log("**********【问题解决!!!尽量不要引用外部js】***********");99 </script>
恶心的JS

 

博客设置