[aaronyang]分享我的博客园皮肤代码

我的皮肤不好看,你打我..

绝对感觉醉好用醉好的博客园皮肤,皮肤都给了,100块都不给我~

在博客园后台里面:有个设置选项,打开它

第一步:给你的博客去个主标题和副标题

第二步:选择博客基础皮肤,并勾选禁用模板默认css

定制css代码如下:

/*公用*/
body {
    font-size:15px;
    padding:0;
    margin:0;
    font-family:"微软雅黑","宋体",Arial;
    background:#243B0D url('http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_1335233352rbUwTp.jpg') no-repeat top center fixed;
    min-width:1200px;
}

#home {
    opacity:1;
    filter: alpha(opacity=100);
    box-shadow:0 0 10px #1C5495;
    margin:20px auto;
    width:96%;
    background:#fff;
    overflow:auto;
    border:solid 1px #fff;

}
/*段落*/
.postBody p,.postCon p {
    margin:3px 0;
    line-height:24px;
}
h3 {
    font-size:16px;
    font-weight:bold;
margin-bottom:3px;
background:#1D5796;
width:177px;
padding:5px;
text-shadow:2px 0px 11px #333030;
}
/*超链接*/
a {
    color:#464646;
    text-decoration:none;
}

a:visited,a:hover {
    color:#464646;
}
ul {
    list-style:none;
    margin:0;
    padding:0;
}
image {
    border:none;
}
#header {
    padding:5px;
}
/*博客标题*/
#blogTitle,#blogTitle a {
    font-weight:bold;
    color:#2796DE;
}
#blogTitle .title {
    margin-top:20px;
    height:100px;
    line-height:100px;
    font-size:55px;
    padding-left:120px;
    background:#fff url('http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_homelogo1.png') no-repeat;
}
.headermaintitle {
    }
#blogTitle,#blogTitle a:hover {
    text-decoration:none;
}
/*子标题*/
.subtitle {
    padding-left:30px;
    font-size:16px;
    color:#1E88AB;
    font-weight:normal;
    margin:5px 0;
}
/*导航栏*/
#navigator {
    font-size:16px;
    height:48px;
    background:#144F94;
    text-align:center;
    margin-top:20px;
    margin-bottom:20px;
    margin:0 auto;
    z-index:100;
}
#navList li {
    margin:0;
    line-height:40px;
    display:inline-block;
    float:left;
}
#navList li:hover {
    background:#0A1F34;
}
#navList li a {
    padding:0 30px;
    text-decoration:none;
    line-height:48px;
    border:0;
    color:#fff;
    display:-moz-inline-box;
    display:inline-block;
}
.blogStats {
    height:48px;
    color:#fff;
    line-height:48px;
}
#main {
    padding:35px;
}
/*左边*/
#sideBarMain {
    padding:0 10px 0 0;
    background:#fff;
    margin:0 0 20px 0;
    width:240px;
    font-size:12px;
    line-height:22px;

}


#sideBarMain a {
    color:#ffffff;
}
#leftcontentcontainer {
    color:#ffffff;
}
.newsItem {
    color:#ffffff;
}
/*公告*/
#profile_block {
    width: 172px;
    background: #1D5796;
    border: 1px solid #14497F;
    padding: 5px 15px;
    margin:10 0 10px;
}


/*主面板*/
#mainContent {
    margin-top:0px;
    padding-top:0px;
    padding-right:0px;
    background:#fff;
    padding-bottom:0px;
    float:right;
    width:98%;
    padding-left:0px;

}
/*每日文章列表*/
.day {
    background:#fff;
    padding:0;
    margin-right:-10px;
    margin:0 0 20px 0;
}
/*博客标题*/
.postTitle a {
    color:#144D8C;
}
.postTitle {
    padding-bottom:10px;
    font-size:20px;
    font-weight:bold;
    color:#464646;
    width:100%;
background:url('http://images.cnblogs.com/cnblogs_com/AaronYang/476978/o_blog12.png') no-repeat 0 3px;
    padding-left:30px;
}
.dayTitle {
    display:none;
}


/*摘要*/
.c_b_p_desc {
    padding:2px;
    line-height:24px;
    color:#888;
}


.c_b_p_desc a {
    color:#086F95;
}
.c_b_p_desc a:hover {
    text-decoration:none;
    border-bottom-width:1px;
    border-bottom-style:dotted;
    color:#259BD2;
}
/*右侧图片*/
.desc_img {
    margin-left:10px;
    border:solid 1px #fff;
    box-shadow:0 0 10px #aaa;
    float:right;
}
/*博文页*/
#topics .post {
    background:#fff;
}
.postCon {
    padding:10px 0px 0 5px;
    width:100%;
}
.postDesc {
    margin:0 30px;
    margin-bottom:2px;
    padding:8px 0px;
    font-size:12px;
    color:#aaa;
    background:#fff;
    text-align:right;
}
.postDesc a {
    color:#1C5495;
}
.postBody {
    padding:0;
}
/*google搜索框*/
#google_q,#q {
    height:22px;
    width:120px;
    border:solid 1px #ccc;
    box-shadow:inset 0 0 3px #ddd;
    border-radius:4px;
}
/*搜索按钮*/
.btn_my_zzk {
    font-family:'Microsoft Yahei';
    border:none;
    height:26px;
    width:60px;
    padding:1px;
    font-size:14px;
    cursor:pointer;
    position:relative;
    vertical-align:middle;
    display:inline-block;
    background:#55895B;
    border-radius:4px;
    color:#fff;
}
.btn_my_zzk:hover {
    background:#6DA47D;
}
/*评论按钮*/

#btn_comment_submit {
    border:none;
    height:48px;
    width:910px;
}
/*评论按钮*/
.comment_btn {
    font-family:'Microsoft Yahei';
    border:none;
    height:48px;
    width:120px;
    font-size:18px;
    cursor:pointer;
    position:relative;
    vertical-align:middle;
    display:inline-block;
    background:#1C5495;
    color:#fff;
}

#btn_comment_submit:hover {
    background:#0495FF;
}

/*评论标题*/
.feedback_area_title {
    padding:10px;
    font-size:24px;
    font-weight:bold;
    color:#1C5495;
    border-bottom:solid 6px #0495FF;
}
.feedbackListSubtitle {
    font-size:12px;
    color:#888;
}
.feedbackListSubtitle a {
    color:#888;
}
.comment_quote {
    background:#FCFAAC;
    padding:15px;
    border:1px solid #CCC;
}
#commentform_title {
    color:#1C5495;
    background-image:none;
    background-repeat:no-repeat;
    margin-bottom:10px;
    padding:10px 20px 10px 10px;
    font-size:24px;
    font-weight:bold;
    border-bottom:solid 6px #1C5495;
}
/*评论框*/
#comment_form {
    margin:10px 0;
    padding:0;
}
.commentform {
    margin:10px 0;
    padding:10px 20px;
    background:#fff;
}
/*评论输入域*/
#tbCommentBody {
    font-family:'MIcrosoft Yahei';
    margin-top:10px;
    width:940px;
    max-width:940px;
    min-width:940px;
    background:white;
    color:#333;
    border:2px solid #fff;
    box-shadow:inset 0 0 8px #aaa;
    padding:10px;
    height:120px;
    font-size:14px;
    min-height:120px;
}
/*评论条目*/
.feedbackItem {
    font-size:14px;
    line-height:24px;
    margin:10px 0;
    padding:20px;
    background:#F2F2F2;
    box-shadow:0 0 5px #aaa;
}
.feedbackListSubtitle {
    font-weight:normal;
}
/*分类页*/
.entrylist {
    padding:10px 20px;
    background:#fff;
}
.entrylistItem {
    margin:10px 0;
    padding:10px;
}
.entrylistPosttitle {
    font-size:18px;
    font-weight:bold;
    background:url('http://images.cnblogs.com/cnblogs_com/libaoheng/305804/o_br229512.link(en-us,MSDN.10).gif') no-repeat 0 3px;
    padding-left:30px;
}
.entrylistPostSummary {
    padding:10px;
}
.entrylistItemPostDesc {
    font-size:12px;
    color:#999;
    padding-left:40px;
}
/*尾部*/
#footer {
    font-size:12px;
    margin:20px;
    padding:12px;
    text-align:center;
    background:#144F94;
    color:#DDD;
    font-size:14px;
}
/*文章内图片*/
#cnblogs_post_body p img {
    margin:5px;
}
#cnblogs_post_body{
padding:3px;
}
/*顶一下*/
.diggnum {
    font-size:28px;
    color:#428133;
    font-family:'Microsoft Yahei';
}
#div_digg .diggnum {
    line-height:100px;
}
.diggit {
    float:left;
    width:128px;
    height:128px;
    background:url('http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_o_dig.gif') no-repeat;
    background-position:0 0;
    text-align:center;
    cursor:pointer;
}
.diggit:hover {
    background-position:-128px 0;
}
/*踩一下(园友反映,这个有点“邪恶”,呵呵,其实是我没来得及设计这个背景图片,就暂时把它隐藏了……可以去掉这句话)*/
.buryit {
    display:none;
}
.diggword {
    display:none;
}
/*green_channel*/
#green_channel {
    text-align:right;
    height:30px;
    background:#237DE5;
    padding-left:20px;
    font-weight:normal;
    font-size:12px;
    border:none;
    color:#fff;
    padding:9px;
    position:fixed;
    right:0px;
    bottom:0px;
    opacity: 0.2;
    filter: alpha(opacity=20);
}
#green_channel:hover{
   filter:alpha(opacity=100);
    opacity:1;
 background:#26476D;
 -webkit-transition:all .5s ease-out;
    -moz-transition:all .5s ease-out;
    -o-transition:all .5s ease-out;
    transition:all .5s ease-out;
}
/*最新评论*/
#myposts .PostList {
    font-size:14px;
    line-height:24px;
    margin:10px 0;
    padding:20px;
    background:#F2F2F2;
    box-shadow:0 0 5px #aaa;
}
#myposts .postTitl2 a {
    color:#132103;
}
::selection {
    background:#BA6701; 
    color:white; 
}
::-moz-selection {
      background:#BA6701;
color:white;  
}
::-webkit-selection {
     background:#BA6701;
     color:white; 
}
.catListPostCategory {
    width: 172px;
    padding: 5px 15px 5px;
    background: #1D5796;
    color: white;
    margin-top:4px;
    border: 1px solid #14497F;
    font-family:"微软雅黑","宋体",Arial;
}

    .catListPostCategory a {
        margin: 0 -15px;
        display: block;
        padding: 5px 10px;
        color: #ffffff;
    }

        .catListPostCategory a:hover {
            background: #EB453D;
           width:200px;
            text-decoration: none;
-moz-box-shadow:2px 2px 5px #333333, 0px 0px 6px #2D3636; -webkit-box-shadow:2px 2px 5px #333333, 0px 0px 6px #2D3636; box-shadow:2px 2px 5px #333333, 0px 0px 6px #2D3636;
             color: #ffffff;
        }
.boxshadow2{
    background-color:white;
    -moz-box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);
    -webkit-box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);
    box-shadow: 0 0 8px rgba(72, 106, 170, 0.5);

}
@-webkit-keyframes glow {
    0% {
        -webkit-box-shadow: 0 0 12px rgba(72, 106, 170, 0.5);
        border-color: rgba(160, 179, 214, 0.5); 
        width:175px;       
    }
    100% {
        -webkit-box-shadow: 0 0 12px rgba(72, 106, 170, 1.0), 0 0 18px rgba(0, 140, 255, 1.0);
        border-color: rgba(160, 179, 214, 1.0); 
        width:160px;
    }
}
@-webkit-keyframes glowred {
    0% {
        -webkit-box-shadow: 0 0 12px rgba(202, 137, 137, 0.5);
        border-color: rgba(197, 73, 73, 0.5); 
             
    }
    100% {
        -webkit-box-shadow: 0 0 16px rgba(230, 72, 51, 1.0), 0 0 38px rgba(220, 34, 4, 1.0);
        border-color: rgba(160, 179, 214, 1.0); 
    }
}
.boxshadow3{
    background-color:#f0f3f9;
    -webkit-animation-name: glowred ;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-timing-function: ease-in-out;    
}

.boxshadow2:hover {
    background-color:#f0f3f9;
    -webkit-animation-name: glow;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-timing-function: ease-in-out;    
}
.boxshadow{
-moz-box-shadow:0px 1px 1px #333333; -webkit-box-shadow:0px 1px 1px #333333; box-shadow:0px 1px 1px #333333;
}

.catListBlogRank ul{
width:122px;
 background: #1D5796;
    border: 1px solid #14497F;
    padding: 5px 15px;
margin:8 0 10px;
-moz-transform:rotate(54deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-moz-transform-origin:0% 0%;-webkit-transform:rotate(54deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-webkit-transform-origin:0% 0%;-o-transform:rotate(54deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);-o-transform-origin:0% 0%;transform:rotate(54deg) scale(1.00,1.00) translate(0px,0px) skew(0deg,0deg);transform-origin:0% 0%
}
.catListBlogRank ul li{
color:#ffffff;
font-size:15px;
text-shadow:2px 0px 11px #333030;

}
.catListBlogRank h3{
display:none;
}
/*---滚动条默认显示样式--*/  
::-webkit-scrollbar-thumb{  
   background-color:#018EE8;  
   height:50px;  
   outline-offset:-2px;  
   outline:2px solid #fff;  
   -webkit-border-radius:2px;  
   border: 2px solid #fff;  
}  
 
/*---鼠标点击滚动条显示样式--*/  
::-webkit-scrollbar-thumb:hover{  
   background-color:#6FABEC;  
   height:50px;  
   -webkit-border-radius:2px;  
}  
 
/*---滚动条大小--*/  
::-webkit-scrollbar{  
   width:8px;  
   height:8px;  
}  
 
/*---滚动框背景样式--*/  
::-webkit-scrollbar-track-piece{  
   background-color:#fff;  
   -webkit-border-radius:0;  
}
::-webkit-scrollbar-thumb:active{
      height:50px;
      background-color:#033367;
      -webkit-border-radius:2px;
  }
.headph:hover img{
  -webkit-transform:rotate(360deg) scale(1.5);
    -moz-transform:rotate(360deg) scale(1.5);
    -o-transform:rotate(360deg) scale(1.5);
    -ms-transform:rotate(360deg) scale(1.5);
    transform:rotate(360deg) scale(1.5);  
}
.headph img{
    -webkit-transition:all 1s ease-in-out;
    -moz-transition:all 1s ease-in-out;
    -o-transition:all 1s ease-in-out;
    -ms-transition:all 1s ease-in-out;    
    transition:all 1s ease-in-out;
    width:48px;
    height:48px;
}
aaronyang 博客皮肤代码

部分讲解:

body {
    font-size:15px;
    padding:0;
    margin:0;
    font-family:"微软雅黑","宋体",Arial;
    background:#243B0D url('http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_1335233352rbUwTp.jpg') no-repeat top center fixed;
    min-width:1200px;
}

background设置整个博客的背景图片,我的是一张水的图片,你可以在博客园后台相册里面上传图片

你可以新建两个相册,1个是用于博客皮肤资源存放的,一个是用于博客首页显示你的靓照的

自己的靓照的相册里面的,相片注意事项:

1.由于css样式侧边栏的限制,目前我的最佳尺寸是175px的宽,你可以使用美图秀秀 等比例缩放你的照片就行了

2.照片上传的名称是有规律的,我的是统一  1.jpg,2.jpg,3.jpg...这样子上传的话,博客园自动处理成o_1.jpg,o_2.jpg,o_3.jpg...

讲解二:

http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_o_dig.gif是博客内容下,推荐 链接的图片,你可以ctrl+f查找这个位置,自己在相册里上传,然后替换地址即可,如果图片规格不一样,自己调整css代码

讲解三:

http://images.cnblogs.com/cnblogs_com/AaronYang/476978/o_blog12.png  是文章标题前面的图片

讲解四:

http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_homelogo1.png是博客你的logo的图片,这张图片在博客最上方可以看到

讲解五:

#green_channel  样式,是右下角的分享,推荐的那个样式

讲解六:

博客内容详情页,才显示快速评论,博客只有滚动了一定内容后,会自动全屏阅读,右上角显示滚动到顶部的按钮

快速评论难点,因为阅读到一定高度,才全屏,所以要连续滚动到指定位置两次,才能精确定位到评论框,哈哈,不过解决了。

滚动条自动全屏难点:以前会影响到滚动的性能,现在已经优化的很好了,不用担心哈。

讲解七:

#home 样式,调整opacity和filter的值,可以调整整个博客的透明度,比如,我调整到0.7,整个博客就会水汪汪的~

#home {
    opacity:1;
    filter: alpha(opacity=100);
    box-shadow:0 0 10px #1C5495;
    margin:20px auto;
    width:96%;
    background:#fff;
    overflow:auto;
    border:solid 1px #fff;

}

更多细节,请自己调整吧

第三部分:博客侧边栏公告(支持HTML代码)

让你拥有自己的随机靓照和自己的qq群宣传吧

<div style=" width: 172px;
    background: #1D5796;
    border: 1px solid #14497F;
    padding: 5px 15px;
    margin:8 0 10px;"> 
<p id="AaronYangImg"></p>
<p>
<a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=66b827eb0962ef9375d6b80dd8327f43c06f07742b73084a7bfe74ef013cf871">
<img class="boxshadow" style="
-webkit-border-top-right-radius:2em;
-webkit-border-top-left-radius:0em;
-webkit-border-bottom-left-radius:2em;
-webkit-border-bottom-right-radius:0em;
-moz-border-radius-topright:2em;
-moz-border-radius-topleft:0em;
-moz-border-radius-bottomleft:2em;
-moz-border-radius-bottomright:0em;
border-top-right-radius:2em;
border-top-left-radius:0em;
border-bottom-left-radius:2em;
border-bottom-right-radius:0em;
" src="http://images.cnblogs.com/cnblogs_com/fresh-air/385358/o_2.jpg"  alt="群号:135043714,这个群含有丰富的最新的.NET电子书和技术解决方案。资源数超过200,高级C#书籍一大堆" title="这个群含有丰富的最新的.NET电子书和技术解决方案。资源数超过200,主要是C#书籍,当然也有PHP,JAVA等" width="80" height="80" /></a>
<a target="_blank" href="http://wp.qq.com/wpa/qunwpa?idkey=6ff5dc5409adb3f3d10d8e6e7ee6a21e55cedd6fa86228f17a9c5e0e5b690a00">
<img class="boxshadow"  src="http://images.cnblogs.com/cnblogs_com/fresh-air/385358/o_%E5%9B%BE%E5%83%8F%205_%E5%89%AF%E6%9C%AC2.jpg" style="-webkit-border-top-left-radius:2em;
-webkit-border-top-right-radius:0em;
-webkit-border-bottom-right-radius:2em;
-webkit-border-bottom-left-radius:0em;
-moz-border-radius-topleft:2em;
-moz-border-radius-topright:0em;
-moz-border-radius-bottomright:2em;
-moz-border-radius-bottomleft:0em;
border-top-left-radius:2em;
border-top-right-radius:0em;
border-bottom-right-radius:2em;
border-bottom-left-radius:0em;" alt="群号:193247142(实验室人已满,不招了),入实验室的条件:C#学习者,必须有一定的基础,不问一些很低级的问题,不聊一些无关本群宗旨的伙伴,爱分享知识,有自己的学习计划,只限招收50人,能进一步的跟我交流技术" title="入实验室的条件:C#学习者,必须有一定的基础,不问一些很低级的问题,不聊一些无关本群宗旨的伙伴,爱分享知识,有自己的学习计划,只限招收50人,能进一步的跟我交流技术" width="80" height="80" /></a>
</p>


</div>
<script>
var chars = ['24','24','33','34','35','36','29','30','31','2','4','32','37','38'];

function generateMixed(n) {
     var res = "";
     for(var i = 0; i < n ; i ++) {
         var id = Math.ceil(Math.random()*13);
         res += chars[id];
     }
     return res;
}

$(function(){
$("#AaronYangImg").html('<a href="http://user.qzone.qq.com/875556003" target="_blank"><img class="boxshadow2" src="http://images.cnblogs.com/cnblogs_com/AaronYang/489758/o_'+generateMixed(1)+'.jpg" alt="AaronYang" title="点我进入AaronYang的QQ空间"/></a>');
});</script>

这里我创建了一个 <p id="AaronYangImg"></p>

然后再下面创建了一个chars数组(注意,第一个,第二个元素值要一样哦),其实是相册里面 图片的名称,下面写了一个随机数方法。

下面*13  是 chars的长度减去1。好了,这里不多讲了,自己去摸索吧

QQ群代码生成链接地址:点击前往

第四部分:页首HTML代码

<style type="text/css">
    .Abstract
    {
        padding: 15px;
        border: dotted 2px #999;
        color: #999;
        font-family: 'Microsoft Yahei';
        border-radius: 4px;
    }
        
    .First
    {
        margin: 10px 0;
        font-family: 'Microsoft Yahei';
        text-align: left;
        padding: 6px 20px;
        color: #fff;
        background: #55895B;
        font-size: 20px;
        border-radius: 4px;
        clear: both;
    }
        
        
    .Second
    {
        margin: 10px 0;
        font-family: 'Microsoft Yahei';
        padding: 6px 20px;
        background: #93C8A2;
        color: #fff;
        font-size: 18px;
        border-radius: 4px;
        clear: both;
    }
        
        
    .Third
    {
        margin: 10px 0;
        padding: 6px 20px;
        font-family: 'Microsoft Yahei';
        margin: 15px 0;
        font-size: 16px;
        color: fff;
        background: #C6EFD2;
        color: #999;
        border-radius: 4px;
        clear: both;
    }
    .note
    {
        margin: 10px 0;
        padding: 15px 20px 15px 60px;
        background: #FCFAA9 url('http://images.cnblogs.com/cnblogs_com/libaoheng/305804/o_yellow-pin.png') no-repeat 20px 0;
        font-size: 15px;
        font-family: 'Microsoft Yahei';
        box-shadow: 0 0 8px #aaa;
        clear: both;
    }
        
    .demo
    {
        text-align: left;
        padding: 6px 20px;
        overflow: auto;
        border-radius: 4px;
        background: orange;
        color: #fff;
        font-size: 16px;
        clear: both;
    }
        /* Image style */
#scrollUp {
-moz-box-shadow:1px 1px 5px #333333; -webkit-box-shadow:1px 1px 5px #333333; box-shadow:1px 1px 5px #333333;
    top: 0px;
    right: 10px;
    height: 58px;  /* Height of image */
    width: 58px; /* Width of image */
    background: url("http://images.cnblogs.com/cnblogs_com/fresh-air/476978/o_selectTop3.png") no-repeat;
         
}
  
</style>

<script>
$(function(){
$("#header").append('<div id="cnzzDivPlace" style="width:100%;margin-top:-5px;"></div>');

$("#green_channel").append('<div id="pageSign"></div>');

});
</script>

这里有个scrollup样式,有个图片,就是回到顶部的那个按钮的代码和样式调节的地方

下面我家了一个js,cnzzDivPlace是cnzz统计代码的显示位置

第五部分:页脚HTML代码

<span style="float:right;padding-right:10px;padding-top:10px;padding-bottom:10px" 

id="cnzzspan">
<a id="openWin" target="_blank" ></a>   
<font color='red'>【推荐】</font>
<a href="http://www.cnblogs.com/aaronyang/archive/2013/05/07/3065090.html" 

target="_blank"><font color='red'><b>程序员网址大全</b></font></a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="http://www.cnblogs.com/AaronYang/tag/EntityFramework/" 

target="_blank"><font color='red'>EF CodeFirst</font></a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/tag/aaronyang百度地图/" 

target="_blank">百度地图.NET</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/archive/2013/06/03/3113543.html" 

target="_blank">MyNPOI</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/tag/%E5%BC%80%E6%BA%90/" 

target="_blank"><b>开源</b></a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/archive/2013/05/15/3079046.html" 

target="_blank">我的皮肤</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/aaronyang/tag/ASP.NET%20MVC4%20IN%20ACTION/" 

target="_blank">ASP.NET MVC4</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/tag/JavaScript/" target="_blank">前端提升

</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/aaronyang/tag/%E9%82%A3%E5%A4%A9%E6%9C%89%E4%B8%AA

%E5%B0%8F%E5%AD%A9%E8%B7%9F%E6%88%91%E8%AF%B4LINQ/" target="_blank">LINQ

</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a 

href="http://www.cnblogs.com/AaronYang/tag/WCF%E7%B3%BB%E5%88%97/" target="_blank">WCF

</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="http://www.cnblogs.com/aaronyang/tag/EasyUI/" 

target="_blank">EasyUI</a>&nbsp;&nbsp;|
<script src="http://s14.cnzz.com/stat.php?id=4725984&web_id=4725984&online=2" 
language="JavaScript">
</script>
</span>
<script src="http://files.cnblogs.com/AaronYang/jquery.scrollUp.min.js" language="JavaScript"></script>
<script>
function ScrollFunction() {
        var sTop = $("#tbCommentBody").offset().top-189;
        $("html,body").animate({ scrollTop: sTop }, 500,function(){
        var sTop2 = $("#tbCommentBody").offset().top-189;
         $("html,body").animate({ scrollTop: sTop2 },10);
     }); 
   }

$(function(){
var ite=$("#cnzzspan").remove();
$("#cnzzDivPlace").append(ite);

});

  $(window).resize(function () {
            tabResize();
        });
var $sbm=$("#sideBarMain");
var $sbar=$("#sideBar");
function tabResize(){
var lh=$sbm.width();
var rh=$("#home").width()-lh-60;
$("#mainContent").width(rh);

}
var heighss=1300;
$(window).load(function(){

     tabResize();
var pinglun=$("#commentform_title");
if(pinglun.length>0){
$("#navList").append('<li style="background:#F15871" class="boxshadow3"><a id="MyLinks1_comment" class="menu" style="text-shadow:0px 0px 6px #E3D342;" href="javascript:ScrollFunction()">快速评论</a></li>');
}
$("li.liRank").css({"cursor":"pointer"});
$("li.liRank").click(function(){
  var obj = document.getElementById("openWin");   
  obj.href = "http://www.cnblogs.com/AllBloggers.aspx";   
  obj.click();  
});
   

var isIE = !!window.ActiveXObject; 
var isIE8 = isIE && !!document.documentMode; 
$.scrollUp();
$("#scrollUp").text("");
$("#scrollUp").attr("title","[AaronYang]杨洋\n帮你回到顶部");

var firstStep=true;
var SecStep=true;

lastkuandu=$("#mainContent").width();
  var $navc=$("#navigator");
    //获取要定位元素距离浏览器顶部的距离
    var navH = $navc.offset().top;
       
    //滚动条事件
    $(window).scroll(function(){
        //获取滚动条的滑动距离
        var scroH = $(this).scrollTop();
                    if(scroH>=navH){
                      if(firstStep){
                    
                         firstStep=false;
      $navc.css({"position":"fixed","top":0,"left":"0%","width":"100%","z-index":"1000"});
                         $navc.addClass("boxshadow");
                     
                      }
                    if(!isIE8&&scroH>heighss&&SecStep&&$sbm.width()>2){
                         SecStep=false;
                         $sbm.css({"width":"0px"});
                         $sbar.hide();
                         tabResize();

                    } 
                   if(isIE8&&scroH>heighss&&SecStep&&$sbm.width()>2){
                         SecStep=false;
                         $sbm.css({"width":"0px"});
                        // $sbar.css({ opacity: 0 }); // 所有浏览器有效
                         $sbar.slideUp();
                         tabResize();

                    }
               }else if(scroH<navH){
                         if(!firstStep){
                            firstStep=true;
                         $navc.css({"position":"static","margin":"0 auto","width":"100%"});
                            $navc.removeClass("boxshadow");
                           }
                         if(!isIE8&&scroH<heighss&&(!SecStep)&&$sbm.width()<3){
                            SecStep=true;
                            $sbm.css({"width":"240px"});
                            $sbar.show();
                            tabResize();
                          }
                       if(isIE8&&scroH<heighss&&(!SecStep)&&$sbm.width()<3){
                            SecStep=true;
                            $sbar.slideDown();
                            $sbm.css({"width":"240px"});
                            tabResize();
                          }
                      }
            });

});


</script>
<script>
var Enabled = true;
$(window).load(function () {
$("#sideBarMain").css({"margin-left":"-30px"});
$.each($(".feedbackItem"),function(i,t){

var comt=$(this).find(".blog_comment_body");

var commentBodyId =comt[0].id; 
var commentId = commentBodyId.substr(commentBodyId.lastIndexOf("_")+1);
var hUrl = $("#comment_"+ commentId+"_avatar").html();
if(hUrl==null){
hUrl ='http://images.cnblogs.com/cnblogs_com/AaronYang/476978/o_11.jpg';
}
   $(this).find("div.feedbackListSubtitle").before('<div style="margin: 0;position:relative;border-radius:5px;width: 49px; height: 49px; border: 2px solid #dddddd;float:left;margin-right:25px;margin-top:10px;"><div class="headph"><img src="'+hUrl+'" alt="AaronYang" style="border-radius:5px;border: medium none; background: none repeat scroll 0% 0% transparent; visibility: visible; padding: 0pt; margin: 0pt; width: 48px; height: 48px; clip: rect(0px, 94px, 94px, 0px); "></div></div>'); 

var hasl=$(this).find("span.louzhu");
if(hasl[0]){
$(this).css({"background":"#252525","color":"#fff"});
$(this).find("a[title='查看所回复的评论']").css({"color":"#fff"});
}

});




    if (Enabled) {
var isIE = !!window.ActiveXObject;
var isIE6 = isIE && !window.XMLHttpRequest;
var isIE8 = isIE && !!document.documentMode;
var isIE7 = isIE && !isIE6 && !isIE;
        var broTip = $("#browserTip");
        if (broTip.length < 1 && (isIE6 || isIE7 || isIE8)) {
            $("#home").before("<div id=\"browserTip\" style=\"opacity:1;width:100%;height:30px;display:none;line-height:30px;border:1px solid #A8AAAC;text-align:center;background:#ffffff;valign:middle\">AaronYang提醒:亲,你的浏览器不给力哦,为了获得更好的体验效果,建议使用<a target=\"_blank\" href=\"https://www.google.com/intl/zh-CN/chrome/browser/\" style=\"color:red;text-decoration:underline\">谷歌浏览器</a>或<a target=\"_blank\" style=\"color:red;text-decoration:underline\" href=\"http://firefox.com.cn/download/\">火狐浏览器</a>浏览本网站 &nbsp;&nbsp;&nbsp;&nbsp;<a href=\"javascript:CloseVersionTip()\">立即关闭</a></span></div>");
            $("#browserTip").slideDown();
            setTimeout(CloseVersionTip, 8000);
        } else {
            $("#browserTip").slideDown();
            setTimeout(CloseVersionTip, 8000);
        } 
    }
});
function CloseVersionTip() {
    var broTip = $("#browserTip");
    if (broTip) {
        $("#browserTip").slideUp();
    }
}

</script>
aaronyang 页脚html代码

在这里你可以调节  二级菜单,这里的地址,建议是tag标签。这里我加了ie浏览器判断,如果ie推荐谷歌或者火狐,用不着的可以删掉

cnzz的js代码怎么获得,自己去cnzz那里学习吧,或者用百度统计也可以。

这里有 独一无二的  二级菜单,独一无二的评论头像,独一无二高大上的快速评论按钮,博主回复内容高亮,独一无二的阅读体验(自动全屏),独一无二的相册展示

第六部分:拓展

博客分享插件

如果你想要  分享那个插件,可以自己去找个插件,然后生成一段javascript代码,放到页脚html代码处就行了,列子

<!-- JiaThis Button BEGIN -->
<script type="text/javascript" src="http://v3.jiathis.com/code_mini/jiathis_r.js?

uid=1362230515548537&move=0&amp;btn=r3.gif" charset="utf-8"></script>
<!-- JiaThis Button END -->

博客背景音乐思路:

找个音乐播放空间,上传一首歌,然后在线播放,拷贝别人的flash生成后的代码,加载博客的地步就行了,然后把播放器的透明度调低,示例代码:

<div class="player" id="player" style="opacity: 0.1;filter: alpha(opacity=10);"><object type="application/x-shockwave-flash" data="http://m.zonse.net/player/?php=music" width="100%" height="40" id="cmp"><param name="allowfullscreen" value="true"><param name="allowscriptaccess" value="always"><param name="wmode" value="transparent"><param name="flashvars" value="lists=Playerlist.php%3Fid%3D12709&amp;src=http%3A%2F%2FM.ZonSe.Net%2FMusic%2FData%2FUpload%2F0E88BEF6B420313864476A1276B73D90.mp3"></object></div>

 

第七部分:为了让你的文章更好看阅读,我自己写了一个适合本博客阅读排版简单示例

代码,我放到了我的博客官网上的那篇博客去了: 点击查看完整版

以后也在那里更新博客了,这边的博客我觉得有用的我已经迁移过去了。

谢谢你已经阅读完,如果你有什么技术问题,可以到 点击这里 给我留言

(我的bootstrap还没学,请不要太在乎我的排版。。我先学bootstrap吧,因为那个wordpress就是bootstrap主题的,默认引入了bootstrap的js包了)

 

posted @ 2014-12-06 11:26  AYUI框架  阅读(...)  评论(...编辑  收藏
【推荐】 程序员网址大全  |  WPF4.5(更新50篇)  |  百度地图.NET  |  MyNPOI  |  开源  |  我的皮肤  |  ASP.NET MVC4  |  前端提升   |  LINQ(9篇完结)   |  WCF   |  EasyUI  |