Diễn Đàn Hỗ Trợ FM
Bạn có muốn phản ứng với tin nhắn này? Vui lòng đăng ký diễn đàn trong một vài cú nhấp chuột hoặc đăng nhập để tiếp tục.

 

[Topx] xdavn Full version

Tác giả: - vào lúc:
lasperpen
Bài viết : 239
Points : 457
Like : 156
PhpBB3
Quản trị
Status : Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
lasperpenMOD
9/4/2016, 15:39
#1

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
[Topx] xdavn Full version 0EctZSD

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

[Topx] xdavn Full version ZRGvbeT
Tags: #latest-topic

Được sửa bởi lasperpen ngày 10/1/2016, 12:07; sửa lần 1.
Kiwi
Bài viết : 289
Points : 601
Like : 160
Punbb
An toàn
Status : Đành vậy thế thôi
KiwiS-MOD
9/4/2016, 17:02
#2
Hot thế, mới yêu cầu đã có rồi Smile
the_dav
Bài viết : 226
Points : 323
Like : 47
Punbb
Quản trị
the_davMEM LV3
9/4/2016, 17:13
#3
ngon phết mà
ShanFan
Bài viết : 36
Points : 40
Like : 2
Punbb
An toàn
ShanFanMOD
9/4/2016, 19:05
#4
demo online đâu :)
Kou94
Bài viết : 134
Points : 210
Like : 12
Punbb
An toàn
Kou94MEM LV3
9/4/2016, 19:06
#5
ShanFan đã viết:
demo online đâu :)

Code:

http://xdavn.com/forums/
ShanFan
Bài viết : 36
Points : 40
Like : 2
Punbb
An toàn
ShanFanMOD
9/4/2016, 19:26
#6
@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 đó á
lasperpen
Bài viết : 239
Points : 457
Like : 156
PhpBB3
Quản trị
Status : Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
lasperpenMOD
9/4/2016, 19:53
#7

Code:

http://demohotrofm.forumvi.com/
Sponsored content
#8
Ads bannerAds banner