[Share] last dạng tab invision

    [Share] last dạng tab invision

    Bài gửi  by AnhDauSai Sun Aug 17, 2014 12:35 pm

    Demo ảnh:
    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>


    Code đã ẩn trả lời để xem nội dung

    sắp xếp:

    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> &nbsp;
    </li>'}
    $(".activea").removeClass("activea");$(".forum" + a).addClass("activea").html(b);$("#loading").fadeOut();})) : ($(".activea").removeClass("activea"), $(".forum" + a).addClass("activea"))})});


    Được sửa bởi AnhDauSai ngày Sun Aug 17, 2014 10:19 pm; sửa lần 2.
    AnhDauSai
    The author of this message was banned from the forum - See the message

    Bài gửi  by AnhDauSai Sun Aug 17, 2014 12:55 pm

    Có ẩn đâu mà xem :)) lừa tình thôi mà
    AnhDauSai
    The author of this message was banned from the forum - See the message

    Bài gửi  by Death Gun Sun Aug 17, 2014 1:42 pm

    like mạnh 
    có gì share nốt cái last cũ bên punbb nha anh
    Death Gun

    Bài gửi  by AnhDauSai Sun Aug 17, 2014 1:47 pm

    huyvip83 đã viết:chắc cái này phải đi theo Skin AD nhỉ
    ko bạn, last ko liên quan gì đến skin
    AnhDauSai
    The author of this message was banned from the forum - See the message

    Bài gửi  by Demon Sun Aug 17, 2014 7:36 pm

    3 Má Ơi Con Đc Lên Ti Vi Nè !!!!
    Demon

    Bài gửi  by Bun.smile Sun Aug 17, 2014 7:57 pm

    :)) không thấy invision à hỏi sao chú bị điên =))
    Bun.smile

    Bài gửi  by AnhDauSai Sun Aug 17, 2014 8:31 pm

    Anh Mất Zin Vì Ai ? đã viết:3 Má Ơi Con Đc Lên Ti Vi Nè !!!!
    cuồng dâm sinh ảo tưởng, xin chia buồn  Neutral 
    AnhDauSai

    Bài gửi  by An Nguyễn Sun Aug 17, 2014 10:03 pm

    xem
    An Nguyễn

    Bài gửi  by Sponsored content