![[Topx] Last dạng tab invision 28vdkeu](https://2img.net/h/oi59.tinypic.com/28vdkeu.jpg)
Lưu ý: last này của version inv nên mình chưa test vs punbb và phpbb
mod_most_active_starters
Code:
<div id="poster1" class="muc_post baimoi laslist" style="display:none;margin-top:34px">
<!-- BEGIN POSTER -->
<li style=" background: transparent; ">
{POSTER.NAME}
<span class="las_right"> {POSTER.NB_TOPICS}</span></li>
<!-- END POSTER -->
</div>Reccent
Code:
<div id="loading" style="display: none;"></div>
<div id="loadddddd" style="display:none">
</div>
<div class="fuck" style="width:66.5%;height: 260px;float:right;border: 1px solid #ddd;
padding:5px;background:#FFF url(http://i.imgur.com/42jdx1a.png)repeat-x left top;margin-top:-4px">
<div class="tag mekiep">
<span style="display:inline-block;padding-bottom: 2px;margin-top: 2px;">
<div data="0" class="active last">Bài mới</div>
<div data="10" class="last">Gunny</div>
<div data="13" class="last">Kiếm thế</div>
<div data="14" class="last">Mu private</div>
<div data="15" class="last">Võ lâm</div>
<div data="16" class="last">Game khác</div>
<div data="1" class="last">Event VnGame</div>
</span></div>
<div class="latest_topic">
<div id="poster" style="display:block;" class="muc_post baimoi laslist" style="margin-bottom:3px;">
<ol class="muc_post baimoi activea forum0" style="overflow:hidden;">
<!-- BEGIN classical_row -->
<!-- BEGIN recent_topic_row -->
<li>
<a href="{classical_row.recent_topic_row.U_TITLE}" title="{classical_row.recent_topic_row.L_TITLE}" class="topicn topictitle1">
<span class="ten1">{classical_row.recent_topic_row.S_POSTTIME}</span>{classical_row.recent_topic_row.L_TITLE}
</a>
<!-- BEGIN switch_poster -->
<a class="las_right" href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
<!-- END switch_poster -->
</li>
<!-- END recent_topic_row -->
<!-- END classical_row -->
</ol>
<ol id="lastest" class="muc_post baimoi forum10"></ol>
<ol id="lastest" class="muc_post baimoi forum13"></ol>
<ol id="lastest" class="muc_post baimoi forum14"></ol>
<ol id="lastest" class="muc_post baimoi forum15"></ol>
<ol id="lastest" class="muc_post baimoi forum16"></ol>
<ol id="lastest" class="muc_post baimoi forum11"></ol>
</div>
</div></div>
<div class="clear"></div>
<style>div.borderwrap {background-color: initial;border: 0;padding: 0;}/*box*/.blockLinksList a:active{background-color: #ccc;}/*khoang cachhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh*/.nodeList{zoom:1}.nodeList .node.level_1{margin-bottom:20px}.nodeList .node{zoom:1;vertical-align:bottom;zoom:1;vertical-align:bottom}.nodeList li{list-style:none}.border{background:#fff;border:1px solid #ccc;box-shadow:rgba(0,0,0,.05) 0 1px 4px;-webkit-box-shadow:rgba(0,0,0,.05) 0 1px 4px;-moz-box-shadow:rgba(0,0,0,.05) 0 1px 4px;-khtml-box-shadow:rgba(0,0,0,.05) 0 1px 4px;border-radius:3px;-webkit-border-radius:3px 3px 3px 3px;-moz-border-radius:3px 3px 3px 3px;-khtml-border-radius:3px 3px 3px 3px}.node .nodeInfo.primaryContent,.node .nodeInfo.secondaryContent{padding:0}.nodeList .categoryForumNodeInfo,.nodeList .forumNodeInfo,.nodeList .pageNodeInfo,.nodeList .linkNodeInfo{padding:10px;border-bottom:1px solid #fff1e5;padding:0;background:#fff}.node .nodeInfo{overflow:hidden;zoom:1;position:relative}.node .nodeText{margin:10px 270px 10px 56px}.node .unread .nodeTitle{color:#fffebf}.node .nodeTitle{font-weight:700;font-size:12px;color:#fffebf}.primaryContent a{color:#900}.node .nodeStats{font-size:11px;margin-top:2px;background:#fff}.nodeStats{overflow:hidden;zoom:1}.nodeStats dl{float:left;display:block;margin-right:10px}.pairsInline dt{color: black;padding-right: 4px;display:inline}.pairsInline dd{display:inline}.node .nodeLastPost{background:url(http://i.imgur.com/Xmc0Lyo.png) repeat-x top #fff;padding:10px;border-bottom:1px solid #ccc;font-size:11px;background:#fff none;padding:3px 10px;margin:6px 10px 10px;border-width:0;position:absolute;top:0;right:0;line-height:16px;white-space:nowrap;word-wrap:normal;overflow:hidden;width:210px;height:28px}.nodeLastPost>a{font-weight:700}.node .nodeLastPost .lastThreadMeta{display:block}.node .tinyIcon{background:url(http://i.imgur.com/sqFYMJi.png) no-repeat -112px -16px;margin:1px 4px;display:block;white-space:nowrap;text-indent:9999px;overflow:hidden;opacity:.25;width:14px;height:14px}.node .nodeInfo:hover .tinyIcon[href]{opacity:1}.node .nodeControls{position:absolute;top:0;right:240px;margin:20px 0}.node .nodeIcon{margin:10px 0 10px 10px;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;-khtml-border-radius:3px;background:no-repeat center center;float:left;box-shadow:inset rgba(0,0,0,.3) 0 1px 2px;-webkit-box-shadow:inset rgba(0,0,0,.3) 0 1px 2px;-moz-box-shadow:inset rgba(0,0,0,.3) 0 1px 2px;-khtml-box-shadow:inset rgba(0,0,0,.3) 0 1px 2px;width:29px;height:29px}.nguoigui{float: left;}.sub a {padding: 2px 15px!important}.sub a:before {content: url(http://i38.servimg.com/u/f38/16/18/15/10/qltt10.gif);margin-right: 5px;}.subforums {margin: 2px 0 3px 0px;overflow: hidden;float: left;width: 100%;}.sub:nth-child(odd) {float: left;clear: both;width: 49%;position: relative;font-weight: bold;font-size: 12px;}.sub:nth-child(even) {float: right;width: 49%;position: relative;font-weight: bold;font-size: 12px;}.sub:nth-child(even):last-child {position: relative;left: -3px;width: 49%;font-weight: bold;font-size: 12px;}</style><script>function last(a){if(a != '' ){var b = a.split('<br />');document.write('<div><span class="nguoigui">' + b[1] + '</span></div><div align="right">Vào lúc : '+b[0]+'.</div>');}}</script><script>$(document).ready(function(){$('.subforums').each(function(){$(this).find('a:has(img)').next().wrap('<li class="sub node forum level-n node_13" />');$(this).find('a:has(img)').remove();});$('.subforums').each(function(index){cm = $(this).html();cm = cm.replace(/, /gi,'');$(this).html(cm);});});</script>mod_top_post_users_month
Code:
<div id="poster3" class="muc_post baimoi laslist" style="display:none;margin-top:26px">
<!-- BEGIN POSTER -->
<li style=" background: transparent; ">
{POSTER.NAME}
<span class="las_right"> {POSTER.NB_POSTS}</span></li>
<!-- END POSTER -->
</div>mod_top_post_users_week
Code:
<div id="poster2" class="muc_post baimoi laslist" style="display:none;margin-top:30px">
<!-- BEGIN POSTER -->
<li style=" background: transparent; ">
{POSTER.NAME}
<span class="las_right"> {POSTER.NB_POSTS}</span></li>
<!-- END POSTER -->
</div>mod_top_posters
Code:
<div class="las_lasttopic">
<div id="lasv_top" style="width:31%;height: 260px;float:left;padding:5px;border: 1px solid #ddd;
border-right: 0px solid #ccc;
background:#FFF url(http://i.imgur.com/42jdx1a.png)repeat-x left top;">
<span style="display:inline-block;padding: 2px 25px 9px 0px;font:bold 12px Tahoma;color:blue;
margin-top:4px;margin-left:5px">
<script type="text/javascript">function showstuff(value){document.getElementById("poster").style.display = (value == "poster") ? "block" : "none";document.getElementById("poster1").style.display = (value == "poster1") ? "block" : "none";document.getElementById("poster2").style.display = (value == "poster2") ? "block" : "none";document.getElementById("poster3").style.display = (value == "poster3") ? "block" : "none";}</script>
<select style=" margin-top: -8px; height: 28px" id="changer" name="type" onchange="showstuff(this.value);">
<option value="poster">Top poster</option>
<option value="poster1">Top mở chủ đề</option>
<option value="poster2">Top poster tuần</option>
<option value="poster3">Top poster tháng</option>
</select></span>
<div id="poster" style="display:block;" class="muc_post baimoi laslist">
<!-- BEGIN POSTER -->
<li style=" background: transparent; ">
{POSTER.NAME}
<span class="las_right"> {POSTER.NB_POSTS}</span></li>
<!-- END POSTER -->
</div></div>
<style>
#loading {
background: url(http://i58.servimg.com/u/f58/18/67/94/07/loadin11.gif) no-repeat center center;
color: #FFF;
filter: alpha(opacity=65);
left: 50%;
margin-top: 5px;
opacity: .9;
padding: 0;
position: absolute;
text-align: center;
width: 300px;
height: 250px;
}
.muc_post a.topicn {margin-top:-.5px;display:inline-block;width:70%;overflow:hidden;height:16px;text-align:left;font:14px Arial;text-overflow:ellipsis;white-space:nowrap;float:left;}
#poster1,#poster2,#poster3{margin-top:36px;width:194px;position:absolute;margin-left:5px;}
.laslist {background:url(http://i.imgur.com/ODResGK.png) no-repeat 0 1px transparent;padding-left:5px;}.las_right {float:right;display:inline-block;text-align:right;}
.muc_post li {list-style:none;border-bottom:1px dashed rgb(235,235,235);padding:3px 0px 3px 20px;height:16px;}
.muc_post {height:232px;overflow:hidden;
margin-top:-1px}
.muc_post span.ten1 {display:none;color:#fff;font:bold 11px Arial;width:auto;height:13px;}
.muc_post a:hover span.ten1 {display:inline-block;position:absolute;margin-left:-118px;background:#000 url(http://i35.servimg.com/u/f35/16/18/15/10/117.png)no-repeat right top;margin-top:-2px;padding:4px 6px;}div.mekiep {float:left;margin-right:-1px;overflow:hidden;position:relative;z-index:8;width:auto;}
.tag div.active {color:#f40;background-color: rgb(255,255,255);height: 18px;border-bottom-color: #fff;}
.tag div {text-decoration:none;color:rgb(20,20,20);text-decoration:none;background-color:#ebebeb;padding:4px 10px 4px 10px;margin-right:2px;margin-bottom:-1px;border:1px solid #ccc;border-top-left-radius:3px;-webkit-border-top-left-radius:3px;-moz-border-radius-topleft:3px;-khtml-border-top-left-radius:3px;border-top-right-radius:3px;-webkit-border-top-right-radius:3px;-moz-border-radius-topright:3px;-khtml-border-top-right-radius:3px;display:inline-block;line-height:18px;cursor:pointer;outline:0 none;height:18px;}.last {border-bottom:1px solid #DBE4EF;border-right:1px solid #DBE4EF;display:block;font-size:11px;font-weight:700;line-height:normal;outline:none;text-decoration:none;}#lastest {line-height:20px;list-style:decimal-leading-zero outside none;}.fuck ol.activea {display:block;}#lastest li {clear:both;}.fuck ol {display: none;}.muc_post li:hover span.ten1 {display: inline-block;position: absolute;margin-left: -118px;background: #000 url(http://i35.servimg.com/u/f35/16/18/15/10/117.png)no-repeat right top;margin-top: -2px;padding: 4px 6px;}#lastest li:hover span.ten1::before {content: "Lượt xem : ";font-size: 12px;color: yellow;}
#lastest a.topictitle {display: inline-block;width: 620px;overflow: hidden;height: 16px;text-align: left;font: 14px Arial;text-overflow: ellipsis;white-space: nowrap;float: left;}.latest_topic {margin-top: 35px;}
</style>sắp xếp :
![[Topx] Last dạng tab invision Jr5hzn](https://2img.net/h/oi57.tinypic.com/jr5hzn.jpg)
tạo 1 file js cho hiển thị ở in the home page
đối với version invision:
Code:
$(function() {
$(".tag div").click(function() {
$(".active").removeClass("active");
$(this).addClass("active");
var a = $(this).attr("data");
0 != a ? ($("#loading")
.show(), $("#loadddddd").load("/f" + a + "-forum .ipbtable", function() {
var b = "";
for (i = 1; i < $("#loadddddd tr")
.length; i++) {
b = b + '<li><span style="overflow: hidden;
position: absolute;width:445px!important; margin-left:10px">' + $(this)
.find('.topic-title:eq(' + i + ')').html() + '</span>
</li>'
}
$(".activea").removeClass("activea");
$(".forum" + a).addClass("activea").html(b);
$("#loading").fadeOut();
})) : ($(".activea").removeClass("activea"), $(".forum" + a).addClass("activea"))
})
});đối với punbb:
Code:
$(function() {$(".tag div").click(function() {$(".active").removeClass("active");
$(this).addClass("active");var a = $(this).attr("data");0 != a ? ($("#loading")
.show(),$("#loadddddd").load("/f" + a + "-forum .helo tr", function() {var b = "";for(i = 1;i < $("#loadddddd tr")
.length;i++) {b = b + '<li><span style="overflow: hidden;
position: absolute; width:760px!important">' + $(this)
.find('tr:eq('+i+') .topic-title').html() +'</span>
</li>'}
$(".activea").removeClass("activea");$(".forum" + a).addClass("activea").html(b);$("#loading").fadeOut();})) : ($(".activea").removeClass("activea"), $(".forum" + a).addClass("activea"))})});
đã viết: 
sao dán code xog hết r vẫn k đc như v nhỉ 
