演示地址：http://www.szsafety.com
安全天地网 首页左边新闻排行榜

效果如图：

此主题相关图片如下：


此主题相关图片如下：


此主题相关图片如下：

---

以下内容只有回复后才可以浏览

标签内容：
<SCRIPT language=JavaScript>
var t05ID=0;
function ShowTabs05(ID){
if(ID!=t05ID){
Tab05Title[t05ID].className='jiaohu1';
Tab05Title[ID].className='jiaohu2';
Tabs05[t05ID].style.display='none';
Tabs05[ID].style.display='';
t05ID=ID;
}
}
</SCRIPT>
  <table class=bg05 cellSpacing=0 cellPadding=0 width=300 border=0>
    <tr align=middle>
      <td class=jiaohu1 width="30%">新闻排行榜</td>
      <td class=jiaohu2 onmousemove=ShowTabs05(0) id=Tab05Title align=middle>周排行</td>
      <td class=jiaohu1 onmousemove=ShowTabs05(1) id=Tab05Title align=middle>月排行</td>
      <td class=jiaohu1 onmousemove=ShowTabs05(2) id=Tab05Title align=middle>总排行</td>
    </tr>
  </table>
  <table class=bg03 cellSpacing=0 cellPadding=0 width=300 border=0>
<TBODY id=Tabs05>
    <tr>
      <td height=237>
        <table height=237 cellSpacing=0 cellPadding=0 width="100%" background={$InstallDir}Images/jiaohu_bg.gif border=0>
          <tr>
            <td width=32> </td>
            <td>
            <!--$总排行榜$-->
            <!--{$GetArticleList(1001,0,true,0,0,9,false,false,"",7,5,1,30,0,false,0,false,false,0,true,false,false,false,false,false,0,1,paihang,,)}--></td>
          </tr>
        </table>
      </td>
    </tr>
<TBODY id=Tabs05 style="DISPLAY: none">
    <tr>
      <td height=237>
        <table height=237 cellSpacing=0 cellPadding=0 width="100%" background={$InstallDir}Images/jiaohu_bg.gif border=0>
          <tr>
            <td width=32> </td>
            <td>
            <!--$总排行榜$-->
            <!--{$GetArticleList(1001,0,true,0,0,9,false,false,"",30,5,1,30,0,false,0,false,false,0,true,false,false,false,false,false,0,1,paihang,,)}--></td>
          </tr>
        </table>
      </td>
    </tr>
<TBODY id=Tabs05 style="DISPLAY: none">
    <tr>
      <td height=237>
        <table height=237 cellSpacing=0 cellPadding=0 width="100%" background={$InstallDir}Images/jiaohu_bg.gif border=0>
          <tr>
            <td width=32> </td>
            <td>
            <!--$总排行榜$-->
            <!--{$GetArticleList(1001,0,true,0,0,9,false,false,"",0,5,1,30,0,false,0,false,false,0,true,false,false,false,false,false,0,1,paihang,,)}--></td>
          </tr>
        </table>
      </td>
    </tr>
  </table>

风格CSS：

/* 排行榜连接样式定义 */
a.paihang{text-decoration: none;font-size: 12px;line-height:216%;} /* 链接无下划线,有为underline */
a.paihang:link {color: #000000;} /* 未访问的链接 */
a.paihang:visited {color: #000000;} /* 已访问的链接 */
a.paihang:hover{color: #669900;text-decoration: underline;} /* 鼠标在链接上 */
a.paihang:active {color: #669900;} /* 点击激活链接 */

.jiaohu1{
         border-right:1px solid #B8CAA2;border-bottom:1px solid #B8CAA2;
         height:25px;
         background:url(hd_up_bg.gif);
         font-weight: normal;
        
}
.jiaohu2{
        border-right:1px solid #B8CAA2;
         height:25px;
}

背景图下载：

此主题相关图片如下：

---

原理很简单：

主要是利用标签{$GetArticleList(参数列表)}的参数
　DateNum ----日期范围，如果大于0，则只显示最近几天内更新的文章
总排行：设置DateNum为0；
月排行：设置DateNum为30；
周排行：设置DateNum为7；
日排行：设置DateNum为1；

再把标签放到滑动门里面就OK 了！