爱秀代码 » Sclub模板修改与美化 » 仿火狼首页N格无图版，不用担心外链失效！

icode 发表于 2020-12-9 20:58

仿火狼首页N格无图版，不用担心外链失效！

[size=5][color=Red][b]此版本没有使用1张图片！不用担心失效，新手安装更简单！
精简一些无用的css。[/b][/color][/size]

[attach]936[/attach]

1、后台导入数据调用文件
[attach]935[/attach]

2、新建模板命名为 huolangX 放入下边代码。[code]
<style>
.dx-icon-1{position: relative;height: 25px;line-height: 25px;border-bottom: 1px dashed #CDCDCD;}
.dx-icon-1 cite {float: right;padding-left: 8px;clear: both;color: #666;}
.dx-pl {table-layout: fixed;height: 25px;overflow: hidden;display: block;margin-left: 22px}
#tab_c li span a{color: #369;}
#huolang {margin-top: 42px;}
.tlb_show .com-1 {width: 35.93%;height: 245px;float: left;border-right: solid 1px #b1c9dc;}
.tlb_show .com-2 {width: 45.93%;height: 245px;float: left;border-right: solid 1px #b1c9dc;}
.tlb_show .com-3 {width: 17.923%;height: 245px;float: left;}
.tlb-topm ul {height: 30px;}
.tlb-topm li {float: left;line-height: 31px;text-align: center;width: 50px;border-right: 1px solid #ccc;cursor: pointer;}
.tlb-disma {display: block;}
.tlb-disma li{list-style: none;}
.tlb-undisa {display: none;}
.tlb-dis {display: block;}
.tlb-dism {display: block;list-style: none;}
.tlb-undis {display: none;}
.tlb-dis span a {color: #2E9AFE;}
.tlb-undism {display: none;}
.tlb_show .txt td {padding: 0; vertical-align: top;}
.tlb_show .txt span {float: right; color: #07519a;}
.icont{height:200px;}
.icont li span{right:5px;top:0px;position:absolute;}
.tongji_a {margin:42px 0 0 0;clear: both;overflow: hidden;line-height:23px;}
#tongji {line-height: 30px;}
.tlb_show {height: 245px; margin: 0 0 10px 0; border: solid 1px #b1c9dc;}
.tlb-topm {background: #f0f0f0;border-bottom: 1px solid #ccc;}
.tlb-normal1 {color: #999;}
.tlb-hover1 {color: #369;font-weight: bold;background: #fff;}
.bm_h {background: #E5EDF2;padding: 0 10px;height: 31px;border: 1px solid #C2D5E3;border-bottom: none;line-height: 31px;white-space: nowrap;overflow: hidden;}
.hide{display:none;}
#tab_t{height: 30px;background: #f0f0f0;border-bottom: 1px solid #ccc;}
#tab_t li {float: left;width: 80px;line-height: 31px;height: 30px;text-align: center;border-right: 1px solid #ccc;border-bottom: none;background: #f0f0f0;cursor: pointer;color:#999;}
#tab_t .act {position: relative;height: 31px;margin-bottom: -1px;background: #fff;color: #369;font-weight: bold;}
#tab_c{padding:4px;height: 209px;}
#tab_c li {position: relative;height: 25px;line-height: 26px;padding: 0px 5px 0px 25px;text-align: left;margin-right: 0px;clear: both;border-bottom: 1px dashed #CDCDCD;}
#tab_c li span {right: 5px;top: 0px;position: absolute;}
#tab_c li:after{content: "";display: inline-block;width: 18px;height: 18px;line-height: 18px;text-align: center;color: #FFF;background: #999999;position: absolute;left: 0;top: 4px;}
#tab_c li:first-child:after {content: "1";background: #FD8C84;}
#tab_c li:nth-child(2):after {content: "2";background: #FFCC99;}
#tab_c li:nth-child(3):after {content: "3";background: #7FD75A;}
#tab_c li:nth-child(4):after {content: "4";background: #CCCCFF;}
#tab_c li:nth-child(5):after {content: "5";background: #60C4FD;}
#tab_c li:nth-child(6):after {content: "6";}
#tab_c li:nth-child(7):after {content: "7";}
#tab_c li:nth-child(8):after {content: "8";}
#tongji p:first-child:after {content: "®";color: #4284ce;font-size: 18px;}
#tongji p:after {display: inline-block;line-height: 28px;text-align: center;float: left;width: 26px;}
.tlb-dism li:after{content: "";display: inline-block;line-height: 20px;text-align: center;position: absolute;top: 2px;}
.tlb-dism li:first-child:after {content: "♛";color: #FD8C84;font-size:20px;}
.tlb-dism li:nth-child(2):after {content: "♚";color: #FFCC99;font-size:20px;}
.tlb-dism li:nth-child(3):after {content: "♕";color: #7FD75A;font-size:20px;}
.tlb-dism li:nth-child(4):after {content: "♔";color: #CCCCFF;font-size:20px;}
.tlb-dism li:nth-child(5):after {content: "♖";color: #60C4FD;font-size:20px;}
.tlb-dism li:nth-child(6):after {content: "❤";color: #F26521;font-size:18px;}
.tlb-dism li:nth-child(7):after {content: "❤";color: #F26521;font-size:18px;}
.tlb-dism li:nth-child(8):after {content: "❤";color: #F26521;font-size:18px;}
</style>

<div id="huolang">
<div id="tongji">
<p class="chart"><em class="tj">{lang index_today}:</em> <em>$todayposts</em><span class="pipe">|</span><em class="tj">{lang index_yesterday}:</em> <em>$postdata[0]</em><span class="pipe">|</span><em class="tj">{lang index_posts}:</em> <em>$posts</em><span class="pipe">|</span><em class="tj">会员:</em> <em>{eval $xunirenshu=$totalmembers *10;}$xunirenshu</em><span class="pipe">|</span><em class="tj">欢迎新会员:</em> <em><a href="space.php?username=$memberenc" target="_blank" class="xi2">{eval request('仿火狼X_新注册会员');}</a></em></p>
</div>
<div style="margin-top: -25px;float: right;">
<!--{if $discuz_uid}--><a href="my.php?item=threads" title="我的帖子" class="xi2">我的帖子</a><span class="pipe">|</span><!--{/if}--><a href="search.php?srchfrom=604800&amp;searchsubmit=yes" title="最新回复" class="xi2">最新回复</a>
</div>

<div class="bm_h cl">
<script type="text/javascript" src='http://icode.258club.com/templates/colors/mrmy.htm'></script>                       
</div>

<script type="text/javascript" src="http://icode.258club.com/templates/colors/js1.htm" ></script>
<script type="text/javascript" src="http://icode.258club.com/templates/colors/js2.htm" ></script>

<div id="duceapp_xhome" class="tlb_show dx-bm dx-forum" config="{'timeout':500,'blockswitch':5000,'event':'click','tabavgranks':1,'preview':1}">
<div class="com-1">
<div class="tlb-disma" id="tbca_01">
{eval request('仿火狼X_精彩图片');}
<script type="text/javascript">new dk_slideplayer("#tbca_01",{width:"100%",height:"245px",fontsize:"12px",time:"5000"});</script>
</div>
</div>  

<div class="com-2">
  <ul id="tab_t">
    <li class="act">最新主题</li>
    <li>最新回复</li>
    <li>精华主题</li>
    <li>热门主题</li>
  </ul>
  <div id="tab_c">
    <div>{eval request('仿火狼X_最新主题');}</div>
    <div class="hide">{eval request('仿火狼X_最新回复');}</div>
    <div class="hide">{eval request('仿火狼X_精华帖子');}</div>
    <div class="hide">{eval request('仿火狼X_本周热门');}</div>
  </div>
</div>

<div class="com-3">
<div id="tb_" class="tlb-topm">
<ul>
<li id="tbm_1" onmouseover="x:HoverLim(1);" class="tlb-hover1">活跃</li>
<li id="tbm_2" onmouseover="x:HoverLim(2);" class="tlb-normal1">财神</li>
<li id="tbm_3" onmouseover="x:HoverLim(3);" class="tlb-normal1">明星</li>
</ul>
</div>
<div class="tlb-dism" id="tbcm_01" style="width:98%; margin: 4px auto;">
{eval request('仿火狼X_积分飙升榜');}
</div>
<div class="tlb-undism" id="tbcm_02" style="width:98%; margin: 4px auto;">
{eval request('仿火狼X_金币飙升榜');}
</div>
<div class="tlb-undism" id="tbcm_03">
{eval request('仿火狼X_本周之星');}
</div>
</div>
</div>
{eval request('仿火狼X_新会员');}
</div>

<script>
function g(o) {
    return document.getElementById(o);
}

function HoverLi(n) {
    for(var i=1;i<=5;i++) {
        g('tb_'+i).className='tlb-normal';
        g('tbc_0'+i).className='tlb-undis';
   }
    g('tbc_0'+n).className='tlb-dis';
    g('tb_'+n).className='tlb-hover';
}
function HoverLim(n) {
    for(var i=1;i<=3;i++) {
        g('tbm_'+i).className='tlb-normal1';
        g('tbcm_0'+i).className='tlb-undism';
   }
    g('tbcm_0'+n).className='tlb-dism';
    g('tbm_'+n).className='tlb-hover1';
}
function HoverLia(n) {
    for(var i=1;i<=2;i++) {
        g('tba_'+i).className='tlb-normal2';
        g('tbca_0'+i).className='tlb-undisa';
   }
    g('tbca_0'+n).className='tlb-disma';
    g('tba_'+n).className='tlb-hover2';
}   
</script>
<script>
window.onload = function(){

    tab("tab_t","li","tab_c","div","onmouseover")
    function tab(tab_t,tab_t_tag,tab_c,tag_c_tag,evt){
        var tab_t = document.getElementById(tab_t);
        var tab_t_li = tab_t.getElementsByTagName(tab_t_tag);
        var tab_c = document.getElementById(tab_c);
        var tab_c_li = tab_c.getElementsByTagName(tag_c_tag);
        var len = tab_t_li.length;
        var i=0;
        var timer = null;
        var num=0;
            for(i=0; i<len; i++){
                tab_t_li[i].index = i;
                tab_t_li[i][evt] = function(){
                  clearInterval(timer);
                    num = this.index;
                    tab_change()
               }
                tab_t_li[i].onmouseout = function(){
                    autoplay();
               }
           }
        
        function tab_change(){
            for(i=0; i<len; i++){
                tab_t_li[i].className = '';
                tab_c_li[i].className = 'hide';
           }
            tab_t_li[num].className = 'act';
            tab_c_li[num].className = '';
       }
        
        function autoplay(){
          timer = setInterval(function(){
              num++;
                if(num>=len) num=0;
              tab_change();
           },10000);
       }
        autoplay();
   }
   
}
</script>[/code]3、在discuz模板找到[code]$pluginhooks[index_header][/code]在下边加[code]{subtemplate huolangX}
[/code]提交即可。

琪乐 发表于 2020-12-9 22:46

[quote]看帖回帖那是一定要的：[img]http://icode.258club.com/images/smilies/007/02.gif[/img]哈哈！好资源，拿走了！[/quote]

梅子 发表于 2020-12-19 22:56

名言句子能自己设定吗？
还有会员数量我这里变成了120:L

无界 发表于 2020-12-24 15:14

[quote]看帖回帖那是一定要的：[img]http://icode.258club.com/images/smilies/007/07.gif[/img]打酱油路过，不关我的事！[/quote]

icode 发表于 2020-12-24 16:36

[colorT]好帖要顶[/colorT]

东窗凝月 发表于 2020-12-26 12:55

[quote]看帖回帖那是一定要的：[img]http://icode.258club.com/images/smilies/007/05.gif[/img]精彩至极,文章写的真棒，对我非常有帮助[/quote]

米酷 发表于 2021-5-27 16:46

好久不见 回来看看呀~

米酷 发表于 2022-10-13 18:46

[color=Red]楼主太厉害了！I*老*虎*U！[/color]

查看完整版本: 仿火狼首页N格无图版，不用担心外链失效！