[Topx] vxf.vn full version

  • lasperpen
    1. [Topx] vxf.vn full version
    avatar ADM

    Index_body

    Code:
    <div class="Latest lasttab">
        <div class="usertabs">
            <ul class="lastnavtab">
                <li class="tabsli selected"><a href="#tab1"><span>Bài viết mới</span></a></li>
                <li class="tabsli"><a href="#tab2"><span>Nhôn nhịp</span></a></li>
                <li class="tabsli last"><a href="#tab3"><span>Xem nhiều</span></a></li>
            </ul>
        </div>
                <!-- BEGIN giefmod_index1 -->
                {giefmod_index1.MODVAR}
                <!-- END giefmod_index1 -->
    </div>

    CSS

    Code:
    /*LATESTTOPIC*/
    .Latest{color:#333;background-color:#fff;margin:auto auto 13px;-webkit-border-top-left-radius:0;-moz-border-radius-topleft:0;-khtml-border-top-left-radius:0;border-top-left-radius:0;-webkit-border-top-right-radius:0;-moz-border-radius-topright:0;-khtml-border-top-right-radius:0;border-top-right-radius:0;-webkit-border-bottom-right-radius:3px;-moz-border-radius-bottomright:3px;-khtml-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-webkit-border-bottom-left-radius:3px;-moz-border-radius-bottomleft:3px;-khtml-border-bottom-left-radius:3px;border-bottom-left-radius:3px;font:13px/18px 'Roboto Condensed',sans-serif;height:100%}
    .Latest.lasttab .usertabs{height:30px;padding:5px 0;border-bottom:1px solid #eff2f7;display:block;margin:auto 10px!important}
    .Latest.lasttab ul.lastnavtab,.Latest.lasttab ul.lastnavtab2{height:30px}
    .Latest.lasttab ul.lastnavtab > li,.Latest.lasttab ul.lastnavtab2 > li{border-bottom:none;float:left;position:relative;font-size:1.11em;margin:auto;border:0 solid #DDD;list-style-type:none;height:30px}
    .Latest ul.lastnavtab > li.selected,.Latest ul.lastnavtab2 > li.selected{color:#000;background-color:#eff2f7}
    .Latest.lasttab ul.lastnavtab > li.selected,.Latest.lasttab ul.lastnavtab2 > li.selected{height:30px}
    .Latest ul.lastnavtab > li a,.Latest ul.lastnavtab2 > li a{font-size:14px;font-family:'Roboto',sans-serif;color:#246faf;text-decoration:none;margin:0;outline:none;display:block;line-height:30px;padding:0 15px;text-align:left}
    .Latest.lasttab ul.lastnavtab > li a,.Latest.lasttab ul.lastnavtab2 > li a{cursor:pointer;line-height:30px;padding:0 15px}
    .Latest .Lastcontent{padding:10px}
    .Latest .Lastcontent ol.Lastcontentlist{counter-reset:numList}
    .Latest .Lastcontent ol.Lastcontentlist li{padding:0;border-top:1px solid #eff2f7;float:left;width:100%}
    .Latest .Lastcontent ol.Lastcontentlist li:first-child{border-top:1px none black}
    .Latest .itemContent{padding:4px 0;-moz-transition:all .2s ease-out;-ms-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;display:table;table-layout:fixed;word-wrap:normal;width:100%}
    .Latest .itemContent:hover{background-color:#eff2f7;padding-right:6px;padding-left:6px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;text-decoration:underline!important}
    .Latest .itemContent .listBlock{display:table-cell;vertical-align:middle}
    .Latest .itemContent .itemTitle{width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:65%}
    .Latest .itemContent .itemDetail{width:150px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .Latest .itemContent .itemDetail,.BRMSContainer .itemContent .itemDetail a{color:#38445f;font-size:14px;text-align:right}
    .Latest .itemContent .itemDetailName{text-align:right}
    .Latest.lasttab{position:relative;width:73%;float:right}
    .Latest.lasttab2{position:absolute;margin-left:-258px;top:0;width:37%}
    .Latest.lasttab2 .itemContent .itemDetail{width:40px}
    .after_view::after{content:" Views"}
    .after_rep::after{content:" Replies"}

    mod_most_active_topics

    Code:
    <div id="tab2" class="Lastcontent selected tab_content" style="display:none">
        <ol class="Lastcontentlist clearfix">
            <!-- BEGIN TOPIC -->
            <li class="topicli">
                <div class="itemContent">
                  <div id="active_topics" class="listBlock itemTitle" style="width: auto;"><img src="http://i.imgur.com/0bZs6yT.gif" style="padding-right:4px" /><a href="{TOPIC.LINK}" title="{TOPIC.TITLE}">{TOPIC.NAME}</a> </div>
                    <div class="listBlock itemDetail itemDetailName rep_viewer after_rep">{TOPIC.TITLE}</div>
                </div>
            </li>
            <!-- END TOPIC -->
        </ol>
    </div>

    mod_most_viewed_topics

    Code:
    <div id="tab3" class="Lastcontent selected tab_content" style="display:none">
        <ol class="Lastcontentlist clearfix">
            <!-- BEGIN TOPIC -->
            <li class="topicli">
                <div class="itemContent">
                  <div id="viewed_topics" class="listBlock itemTitle" style="width: auto;"><img src="http://i.imgur.com/0bZs6yT.gif" style="padding-right:4px" /><a href="{TOPIC.LINK}" title="{TOPIC.TITLE}">{TOPIC.NAME}</a> </div>
                  <div class="listBlock itemDetail itemDetailName rep_viewer after_view">{TOPIC.TITLE}</div>
                </div>
            </li>
            <!-- END TOPIC -->
        </ol>
    </div>

    mod_recent_topics

    Code:
    <!-- BEGIN classical_row -->
        <div id="tab1" class="Lastcontent selected tab_content">
            <ol class="Lastcontentlist clearfix">
              <!-- BEGIN recent_topic_row -->
                <li class="topicli">
                    <div class="itemContent">
                      <div class="listBlock itemTitle" style="width: auto;"><img src="http://i.imgur.com/0bZs6yT.gif" style="padding-right:4px" /><a href="{classical_row.recent_topic_row.U_TITLE}" title="{classical_row.recent_topic_row.L_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a> </div>
                      <!-- BEGIN switch_poster -->
                        <div class="listBlock itemDetail itemDetailName"> <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}" class="username" dir="auto">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a> </div>
                      <!-- END switch_poster -->
                      <!-- BEGIN switch_poster_guest -->
                      {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
                      <!-- END switch_poster_guest -->
                    </div>
                </li>
              <!-- END recent_topic_row -->
            </ol>
        </div>
    <!-- END classical_row -->

    mod_top_posters

    Code:
    <div class="Latest lasttab2">
        <div class="usertabs">
            <ul class="lastnavtab2">
                <li class="tabsli selected"><a><span>Top poster</span></a></li>
            </ul>
        </div>
        <div class="Lastcontent selected">
            <ol class="Lastcontentlist clearfix">
            <!-- BEGIN POSTER -->
            <li class="topicli">
                <div class="itemContent">
                    <div id="topposters" class="listBlock itemTitle" style="width:180px">{POSTER.NAME}</div>
                  <div class="listBlock itemDetail itemDetailName rep_viewer">{POSTER.NB_POSTS}</div>
                </div>
            </li>
            <!-- END POSTER -->
            </ol>
        </div>
    </div>

    JS

    In the hompage
    Code:
    $(document).ready(function() {
        $(".lastnavtab li").click(function() {
            $(".lastnavtab li").removeClass('selected');
            $(this).addClass("selected");
            $(".tab_content").hide();
            var selected_tab = $(this).find("a").attr("href");
            $(selected_tab).fadeIn();
            return false;
        });
    $(".rep_viewer").each(function() {
        $(this).html(parseInt($(this).text().replace(/^[\s\S]*-\s+(\d+)\s+[\s\S]*$/m, '$1')));
    });
    });
    Widget

    cover by lasperpen
    #codefm

    Tags: #latest-topic #las-topic



    Được sửa bởi lasperpen ngày 01.10.16 12:04; sửa lần 6.

  • Admin
    2. Re: [Topx] vxf.vn full version
    avatar ACP
    Thứ tự sắp xếp wiget ko có à e ơi


    --Chữ ký--
    www.danganhviet.com


    • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
      - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
      - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
      - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
  • lasperpen
    3. Re: [Topx] vxf.vn full version
    avatar ADM
    vừa bổ sung rồi đấy a


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • Sponsored content

Thông tin tác giả
avatar
ADM
Bài viết :
193
Points :
393
Like :
142
PhpBB3
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
ACP
Bài viết :
329
Points :
636
Like :
106
Punbb
Quản trị
Status :
test
Xem lý lịch thành viên http://hotrofm.forumvi.com
Thông tin tác giả
avatar
ADM
Bài viết :
193
Points :
393
Like :
142
PhpBB3
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
Sponsored content
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết