pjblog侧边四栏分页效果

这个相信大家都喜欢，都来看看，效果如本博右边栏所示
具体添加方法：
1.修改 comomn.js 在最底下加入

//*相关信息 选项卡标签*/
function showDiv(sobj,num){
for(var id = 1;id<=4;id++){
var ss = sobj + id;
var nss = sobj + "nav" + id;
if(id==num){
try{$(ss).style.display="block"}catch(e){};
try{$(nss).className="active"}catch(e){};
}else{
try{$(ss).style.display="none"}catch(e){};
try{$(nss).className=""}catch(e){};
}
}
}

然后在后台建立模块

<div class="&quot;endTag&quot;">
<ul>
 <li id="&quot;leftnav1&quot;">
<h2><a onmouseover="&quot;javascript:showDiv('left',1);&quot;" href="&quot;javascript:showDiv('left',1);&quot;" target="&quot;_self&quot;">热 门</a></h2>
</li>
 <li id="&quot;leftnav2&quot;" class="&quot;active&quot;">
<h2><a onmouseover="&quot;javascript:showDiv('left',2);&quot;" href="&quot;javascript:showDiv('left',2);&quot;" target="&quot;_self&quot;">日 志</a></h2>
</li>
 <li id="&quot;leftnav3&quot;">
<h2><a onmouseover="&quot;javascript:showDiv('left',3);&quot;" href="&quot;javascript:showDiv('left',3);&quot;" target="&quot;_self&quot;">评 论</a></h2>
</li>
 <li id="&quot;leftnav4&quot;">
<h2><a onmouseover="&quot;javascript:showDiv('left',4);&quot;" href="&quot;javascript:showDiv('left',4);&quot;" target="&quot;_self&quot;">留 言</a></h2>
</li>
</ul>
</div>
<div class="&quot;endContent&quot;">
<div id="&quot;left1&quot;" style="&quot;display:none;&quot;">&lt;$HotLog$&gt;</div>
<div id="&quot;left2&quot;" style="&quot;display:block;&quot;">&lt;$NewLog$&gt;</div>
<div id="&quot;left3&quot;" style="&quot;display:none;&quot;">$comment_code$</div>
<div id="&quot;left4&quot;" style="&quot;display:none;&quot;">&lt;$NewMsg$&gt;</div>
</div>

然后在皮肤下的layout.css

加入

/* 选项卡关键属性 */
.endTag{clear:both; height:26px; background:url(end_n_bg3.gif) bottom repeat-x; margin:0 auto; }
.endTag .text{float:left;background:url(end_n_i6.gif) 0 7px no-repeat; padding:4px 8px 0 18px; text-align:left;}
.endTag ul{ float:left;list-style:none;}
.endTag li{float:left; margin:0 3px 0 0; border:1px solid #ccc; border-bottom:0; height:24px; background:#fff;overflow:hidden;}
.endTag .active{ height:25px;}
.endTag h2{padding:4px 10px 0 10px; clear:both;}
.endTag a{color:#000;font-size:12px;}
.endTag a:visited{color:#000;}
.endTag a:hover{color:#bc2931;}
.endTag .text a{color:#1f3a87;}
.endTag .text a:hover{color:#bc2931;}
.endContent {margin-top:6px;margin-left:10px;height:auto;}
.Content-body .endContent {height:90px;}
.Pcontent .endContent {margin-left:0;}
.Pcontent .endTag {margin-top:15px;}
.Content-body .endContent ul{margin-left:20px;}
.Content-body .endContent li{list-style-type: disc;}