[Topx] xdavn Full version

  • lasperpen
    1. [Topx] xdavn Full version
    avatar ADM

    Latest topic xdavn Full version


    Latest topic xdavn Full version được đánh giá khá cao bởi khả năng thẩm mỹ rất đẹp và đơn giản dành cho các site về IT

    Index_body

    Code:
    <div id="hotrofm-topx" class="full large">
        <div class="lpp_hotrofm">
            <div class="larva-topx">
                <ul class="topx-tabs">
                  <li class="sub-tab active"><a href="#tab1">Bài viết mới</a></li>
                  <li class="sub-tab"><a href="#tab2">Chủ xem nhiều</a></li>
                    <li id="refresh" title="Cập nhật lại"></li>
                    <li class="select-list" style="display:none"> <select class="form-control" id="xdavn-topx-result-count"> <option value="12">12</option> <option value="22">22</option> <option value="32">32</option> <option value="42">42</option> <option value="52">52</option> </select> </li>
                </ul>
                <ul class="head-col">
                    <li class="list-topx-header"> </li>
                </ul>
                <!-- BEGIN giefmod_index1 -->
                {giefmod_index1.MODVAR}
                <!-- END giefmod_index1 -->
            </div>
        </div>
    </div>
     
      <script type="text/javascript">
          //<![CDATA[
          var versionMinor = parseFloat(navigator.appVersion),
             versionMajor = parseInt(versionMinor),
             IE = document.all && !window.opera && 7 > versionMajor,
             IE7 = document.all && !window.opera && 7 <= versionMajor,
             OP = window.opera,
             FF = document.getElementById,
             NS = document.layers;

          function get_item(a, c) {
             if (IE) return c ? window.opener.document.all[a] : document.all[a];
             if (FF) return c ? window.opener.document.getElementById(a) : document.getElementById(a);
             if (NS) return c ? window.opener.document.layers[a] : document.layers[a]
          }

          var current_tooltip;

          function show_tooltip(a, c) {
             var b = get_item("tooltip");
             b || (b = document.createElement("div"), b.setAttribute("id", "tooltip"), document.body.appendChild(b));
             b.style.zIndex = 1000;
             b.style.position = "absolute";
             b.innerHTML = "<p>" + c + "</p>";
             b.style.visibility = "visible";
             a.onmousemove = move_tooltip;
             a.onmouseout = function() {
                b.style.visibility = "hidden"
             };
             a.title = ""
          }
          var offsetxpoint = -60,
             offsetypoint = 20,
             real_body = document.compatMode && "BackCompat" != document.compatMode ? document.documentElement : document.body,
             real_body = document.documentElement ? document.documentElement : document.body;

          function move_tooltip(a) {
             var c = !IE ? a.pageX : event.clientX + real_body.scrollLeft,
                d = !IE ? a.pageY : event.clientY + real_body.scrollTop,
                b = IE && !window.opera ? real_body.clientWidth - event.clientX - offsetxpoint : window.innerWidth - a.clientX - offsetxpoint - 20,
                e = IE && !window.opera ? real_body.clientHeight - event.clientY - offsetypoint : window.innerHeight - a.clientY - offsetypoint - 20,
                f = 0 > offsetxpoint ? -1 * offsetxpoint : -1E3;
             current_tooltip = get_item("tooltip");
             current_tooltip.style.left = b < current_tooltip.offsetWidth ? IE ? real_body.scrollLeft + event.clientX - current_tooltip.offsetWidth + "px" : window.pageXOffset + a.clientX - current_tooltip.offsetWidth + "px" : c < f ? "5px" : c + offsetxpoint + "px";
             current_tooltip.style.top = e < current_tooltip.offsetHeight ? IE ? real_body.scrollTop + event.clientY - current_tooltip.offsetHeight - offsetypoint + "px" : window.pageYOffset + a.clientY - current_tooltip.offsetHeight - offsetypoint + "px" : d + offsetypoint + "px"
          }
          $(".list-link .list-link-col a.larva_tooltip:first-child").mouseover(function() {
             show_tooltip(this, $(this).next().html())
          });
            $(".topx-tabs li").click(function() {
            $(".topx-tabs li").removeClass('active');
            $(this).addClass("active");
            $(".topx-content").hide();
            var active_tab = $(this).find("a").attr("href");
            $(active_tab).fadeIn();
            return false;
        });
           //]]>
       </script>

    mod_most_viewed_topics

    Code:
    <ul id="tab2" class="topx-content" style="display:none">
        <!-- BEGIN TOPIC -->
        <li class="list-link">
            <div class="list-link-col list-link-title"><a class="larva_tooltip" href="{TOPIC.LINK}">{TOPIC.NAME}</a>
                <div class="tooltip_data" style="display:none">
                    <div class="tooltipContent">
                        <b>{classical_row.recent_topic_row.L_TITLE}</b>
                        {TOPIC.TITLE}</div>
                    <span class="arrow"></span>
                </div>
            </div>
        </li>
        <!-- END TOPIC -->
    </ul>

    mod_recent_topics

    Code:
    <ul id="tab1" class="topx-content">
        <!-- BEGIN classical_row -->
        <!-- BEGIN recent_topic_row -->
        <li class="list-link">
            <div class="list-link-col list-link-title"><a class="larva_tooltip" href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.L_TITLE}</a>
                <div class="tooltip_data" style="display:none">
                    <div class="tooltipContent">
                        <b>{classical_row.recent_topic_row.L_TITLE}</b>
                        <br /> Username:
                        <!-- BEGIN switch_poster -->
                        <a href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
                        <!-- END switch_poster -->
                        <!-- BEGIN switch_poster_guest -->
                        {classical_row.recent_topic_row.switch_poster_guest.S_POSTER}
                        <!-- END switch_poster_guest -->
                        <br /> Thời gian: {classical_row.recent_topic_row.S_POSTTIME}</div>
                    <span class="arrow"></span>
                </div>
            </div>
            <div class="list-link-col list-link-time"><span class="topx-timmer">{classical_row.recent_topic_row.S_POSTTIME}</span></div>
        </li>
        <!-- END recent_topic_row -->
        <!-- END classical_row -->
    </ul>

    CSS

    Code:
    #hotrofm-topx li{list-style:none}
    #hotrofm-topx{width:100%;height:auto;position:relative;margin:10px auto;line-height:.5;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}
    #hotrofm-topx .lpp_hotrofm{position:relative;width:auto;background:#fff;border:1px solid #ccc;-webkit-box-shadow:0 0 12px rgba(50,50,50,0.2);-moz-box-shadow:0 0 12px rgba(50,50,50,0.2);-webkit-box-shadow:0 0 12px rgba(50,50,50,0.2);-moz-box-shadow:0 0 12px rgba(50,50,50,0.2);-khtml-box-shadow:0 0 12px rgba(50,50,50,0.2);-webkit-box-shadow:0 0 12px rgba(50,50,50,0.2);-moz-box-shadow:0 0 12px rgba(50,50,50,0.2);-khtml-box-shadow:0 0 12px rgba(50,50,50,0.2);box-shadow:0 0 12px rgba(50,50,50,0.2);margin-right:320px;margin-right:0!important}
    #hotrofm-topx ul.topx-tabs{position:absolute;top:0;left:0;right:0;padding:9px 12px 3px;margin:0;text-align:left;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;-khtml-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;list-style-type:none}
    #hotrofm-topx ul.topx-tabs .sub-tab{float:left;margin:0;cursor:pointer;padding:0 21px;height:31px;line-height:31px;overflow:hidden;position:relative;display:inline-block;vertical-align:top;color:#162736;font-family:arial;font-size:13px}
    #hotrofm-topx ul.topx-tabs li.active{background:#4cc8f1;color:#fff;border-bottom:1px solid #FFF;margin:0 -1px;border-top:0 solid #4cc8f1}
    #hotrofm-topx ul.topx-tabs li.active a{color:#fff}
    #hotrofm-topx ul.topx-tabs #refresh{float:right;height:20px;width:20px;background:url(http://xdavn.com/styles/xdavn/topx/refresh.png) no-repeat center;cursor:pointer;margin:4px 10px}
    #hotrofm-topx ul.topx-tabs .select-list{float:right}
    #hotrofm-topx ul.topx-tabs .select-list select{padding:5px;border:1px solid #eff2f7}
    #hotrofm-topx .head-col{padding:0;margin:50px 10px 5px;list-style-type:none;font-family:arial;font-size:12px;text-decoration:none;color:#162736}
    #hotrofm-topx .topx-content{padding:0;margin:0 10px 10px;list-style-type:none;font-family:arial;font-size:14px;text-decoration:none}
    #hotrofm-topx .topx-content .list-link{padding:5px 0 0 10px}
    #hotrofm-topx .topx-content .list-link::nth(2){border-top:0}
    #hotrofm-topx .topx-content .list-link:active{background-color:#eff2f7;color:#38445b}
    #hotrofm-topx .list-topx-header .list-link-col,#hotrofm-topx .list-link .list-link-col{display:inline-block;padding:6px 3px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
    #hotrofm-topx.large .list-link-title{width:85%;min-width:200px!important}
    #hotrofm-topx .list-link .list-link-col>span{width:auto;max-width:100%;display:inline-block;white-space:nowrap;text-overflow:ellipsis}
    #hotrofm-topx .tooltip{display:inline;position:relative}
    #hotrofm-topx .list-link .list-link-col>a{width:auto;max-width:100%;display:inline-block;color:#797979;text-decoration:none;white-space:nowrap;text-overflow:ellipsis;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}
    #hotrofm-topx.large .list-link-time{display:inline-block;width:15%}
    #hotrofm-topx .list-link .list-link-col>span{width:auto;max-width:100%;display:inline-block;white-space:nowrap;text-overflow:ellipsis}
    /* Tooltip */
    #tooltip{font-size:13px;color:#666;background-color:#fff;padding:5px 10px;-webkit-border-radius:2px;-moz-border-radius:2px;-khtml-border-radius:2px;border-radius:2px;-webkit-border-bottom-left-radius:0;-moz-border-radius-bottomleft:0;-khtml-border-bottom-left-radius:0;border-bottom-left-radius:0;z-index:999;cursor:default;-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.25);-moz-box-shadow:0 2px 5px rgba(0,0,0,0.25);-khtml-box-shadow:0 2px 5px rgba(0,0,0,0.25);box-shadow:0 2px 5px rgba(0,0,0,0.25)}
    /*prefix*/
    .prefix{background-color:#777;padding-right:10px;padding-left:10px;-webkit-border-radius:2px;-moz-border-radius:2px;-khtml-border-radius:2px;border-radius:2px;display:inline-block;line-height:20px;text-transform:uppercase;margin-right:5px}
    .prefix.thong-bao{color:#fff;background-color:#EB6B6B;border-color:#F88}
    .prefix.test{color:#fff;background-color:#98e2a1;border-color:#90ee90}

    Widget


    Tags: #latest-topic



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

  • Móm Đặc Biệt
    2. Re: [Topx] xdavn Full version
    avatar S-MOD
    Hot thế, mới yêu cầu đã có rồi Smile


    --Chữ ký--
    Laughing Diễn đàn Rao vặt, anh em rãnh ghé thăm nhé Laughing


    Very Happy Địa chỉ: http://vnraovat.forumvi.com/ Very Happy
  • the_dav
    3. Re: [Topx] xdavn Full version
    avatar MEM LV3
    ngon phết mà

  • ShanFan
    4. Re: [Topx] xdavn Full version
    avatar MOD
    demo online đâu :)


    --Chữ ký--
    Smile

    Hãy ghé qua đây >> http://4rdinhcao.forumvi.com/ để được hỗ trợ

    Smile Very Happy
  • Kou94
    5. Re: [Topx] xdavn Full version
    avatar MEM LV3
    @ShanFan đã viết:demo online đâu :)
    Code:
    http://xdavn.com/forums/

  • ShanFan
    6. Re: [Topx] xdavn Full version
    avatar MOD
    @Kou94 cái đó tôi yêu cầu mà. Cái demo tồi muốn là cái forumotion của mình có xài last đó á


    --Chữ ký--
    Smile

    Hãy ghé qua đây >> http://4rdinhcao.forumvi.com/ để được hỗ trợ

    Smile Very Happy
  • lasperpen
    7. Re: [Topx] xdavn Full version
    avatar ADM
    Code:
    http://demohotrofm.forumvi.com/

  • Sponsored content

Thông tin tác giả
avatar
ADM
Bài viết :
188
Points :
386
Like :
140
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
S-MOD
Bài viết :
285
Points :
592
Like :
157
Punbb
An toàn
Status :
Đành vậy thế thôi
Xem lý lịch thành viên http://vnraovat.forumvi.com/
Thông tin tác giả
avatar
MEM LV3
Bài viết :
220
Points :
316
Like :
46
Punbb
Quản trị
Xem lý lịch thành viên
Thông tin tác giả
avatar
MOD
Bài viết :
36
Points :
40
Like :
2
Punbb
An toàn
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV3
Bài viết :
112
Points :
165
Like :
9
Punbb
An toàn
Xem lý lịch thành viên
Thông tin tác giả
avatar
MOD
Bài viết :
36
Points :
40
Like :
2
Punbb
An toàn
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
188
Points :
386
Like :
140
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