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

发帖

查看: 5万|回复: 7

[教学] 仿火狼首页N格无图版，不用担心外链失效！ [复制链接]

爱秀创始人

电梯直达 楼主

icode(无界)发表于 2020-12-9 20:58 | 只看该作者倒序看帖字体大小:

阅读模式

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

附件：您需要登录才可以下载或查看，没有帐号？立即注册

此版本没有使用1张图片！不用担心失效，新手安装更简单！
精简一些无用的css。

微信截图_20201209204729.png

1、后台导入数据调用文件

discuz_request_20201209.rar (2.91 KB)

2、新建模板命名为 huolangX 放入下边代码。

<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;">
<a href="my.php?item=threads" title="我的帖子" class="xi2">我的帖子</a><span class="pipe">|</span><a href="search.php?srchfrom=604800&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>