[Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs

  Bài viết hay nhất1
View ngang có avatar drop và khung quote, code, spoiler của DEVs
Có nút xem pet, khi click vào nó sẽ trượt khung thông tin ra và hiện khung pet
Vui lòng không đem tung hàng đi nơi khác một cách quá lộ liễu :v

[Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Demo_c10

À thêm cái lưu ý nữa là méo không hề động chạm tí gì đến js nên khi click vào nút [xêm pết] nó sẽ trượt cái khung profile và phải click ra ngoài nó mới chịu trở lại như cũ. Tại ở đây méo xài :focus nên càng bấm nút [xêm pết] nó càng không chịu về vị trí ban đầu :)

View:
Code:
<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
  <ul>
      <!-- BEGIN switch_plus_menu -->
      <li>
        <script type="text/javascript">//<![CDATA[
            var url_favourite = '{switch_user_logged_in.U_FAVOURITE_JS_PLUS_MENU}';
            var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
            var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
            var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
            var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
            var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
            insert_plus_menu_new('f{FORUM_ID}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
        //]]>
        </script>
      </li>
      <!-- END switch_plus_menu -->
     
      <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
      <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <!-- BEGIN watchtopic -->
      <li>{S_WATCH_TOPIC}</li>
      <!-- END watchtopic -->
  </ul>
  <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
  <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->

<div class="pun-crumbs noprint">
  <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} »
      <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
   
  </p>
</div>

<div class="main paged">
  <div class="paged-head clearfix">
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
      <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> 
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>
  {POLL_DISPLAY}
  <div class="main-head clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#bottom">{L_GOTO_DOWN}</a> 
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
  </div>

  <div class="main-content topic">
      <!-- BEGIN postrow -->
        <!-- BEGIN displayed -->
<div class="post"{postrow.displayed.THANK_BGCOLOR}></div>
<table align="center" cellpadding="0" cellspacing="0" style="width: 100%; ">
  <tbody>
    <tr><td class="vifuser"><div class="petvif">{postrow.displayed.POSTER_RPG}</div><button class="xempet">Xem pet</button><div class="infovifus" style="width:100%;height:150px;">
       
       
        <div class="user-ident dropRight"><div class="poster-avatar">{postrow.displayed.POSTER_AVATAR}</div>
        <div class="poster-info"><div>
          <span class="poster-name">{postrow.displayed.POSTER_NAME}</span>
          <span class="poster-connect">{postrow.displayed.ONLINE_IMG}</span>
          <span class="poster-rank">{postrow.displayed.RANK_IMAGE}</span>
        </div>
        <div class="poster-field"> <!-- BEGIN profile_field --><p>
        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}</p>
        <!-- END profile_field --></div>
        <div class="poster-link">
        <a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">
          <img alt="Tường nhà" src="http://i48.servimg.com/u/f48/16/58/89/73/profil10.png" />Tường nhà
        </a>
          <a target="_blank" href="/spa/[POSTER_NAME]">
        <img alt="Xem bài viết" src="http://i48.servimg.com/u/f48/16/58/89/73/total_10.gif" />Bài viết
          </a>
        <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">
          <img alt="Kết bạn" src="http://i48.servimg.com/u/f48/16/58/89/73/friend10.png" />Kết bạn
        </a>
          <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">
        <img alt="Chặn người này" src="http://i57.servimg.com/u/f57/17/05/17/70/button10.png" />Ngăn cấm
          </a></div></div></div>
      </div></td>
    </tr>
  </tbody>
</table>
<table align="center" border="0" cellpadding="0" cellspacing="0" style="width: 100%; ">
  <tbody>
      <tr>
        <td>
            <a name="{postrow.displayed.U_POST_ID}"></a>
            <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
  </div>
                        <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
            <h2>
              <strong>Bài viết: {postrow.displayed.COUNT_POSTS}</strong>
              {postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> {postrow.displayed.POST_DATE_NEW}
            </h2>
        </div>
              <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                  <div class="post-entry">
                    <div class="entry-content">
                        <!-- BEGIN switch_vote_active -->
                        <div class="vote gensmall">
                          <!-- BEGIN switch_vote -->
                          <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
                          <!-- END switch_vote -->

                          <!-- BEGIN switch_bar -->
                          <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                              <!-- BEGIN switch_vote_plus -->
                              <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                              <!-- END switch_vote_plus -->

                              <!-- BEGIN switch_vote_minus -->
                              <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                              <!-- END switch_vote_minus -->
                          </div>
                          <!-- END switch_bar -->

                          <!-- BEGIN switch_no_bar -->
                          <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
                          <!-- END switch_no_bar -->

                          <!-- BEGIN switch_vote -->
                          <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>
                          <!-- END switch_vote -->
                        </div>
                        <!-- END switch_vote_active -->
                        <div>
                          <div>{postrow.displayed.MESSAGE}</div>
                          <!-- BEGIN switch_attachments -->
                          <dl class="attachbox">
                              <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
                              <dd>
                                <!-- BEGIN switch_post_attachments -->
                                <dl class="file">
                                    <dt>
                                      <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" />

                                      <!-- BEGIN switch_dl_att -->
                                      <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_dl_att -->

                                      <!-- BEGIN switch_no_dl_att -->
                                      {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_no_dl_att -->
                                    </dt>

                                    <!-- BEGIN switch_no_comment -->
                                    <dd>
                                      <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                                    </dd>
                                    <!-- END switch_no_comment -->

                                    <!-- BEGIN switch_no_dl_att -->
                                    <dd>
                                      <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                                    </dd>
                                    <!-- END switch_no_dl_att -->

                                    <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd>
                                </dl>
                                <!-- END switch_post_attachments -->
                              </dd>
                          </dl>
                          <!-- END switch_attachments -->
                          <div class="clear"></div>
                        </div>
                        <p>
                          {postrow.displayed.EDITED_MESSAGE}
                        </p>
                    </div>
                  </div>
              </div>

              <!-- BEGIN switch_signature -->
              <div class="sig-content">
                  <hr>{postrow.displayed.SIGNATURE_NEW}</div>
              <!-- END switch_signature -->

                                <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
            <div class="postfoot">
                  <div class="user-contact">
                    {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
                  </div>
                  <div class="post-options">
                    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
                  </div>
                                  <div style="clear:both;"></div></div>
                                  </div>
                    </td>
      </tr>
  </tbody>
</table>
        <!-- BEGIN first_post_br -->
      </div>
      <hr id="first-post-br" />
      <div class="main-content topic">
        <!-- END first_post_br -->
        <!-- END displayed -->
        <!-- BEGIN hidden -->
            <p class="p-hidden">{postrow.hidden.MESSAGE}</p>
        <!-- END hidden -->
      <!-- END postrow -->
  </div>

  <div class="main-foot clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#top">{L_BACK_TO_TOP}</a> 
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
      <p class="options">
        <input type="hidden" name="t" value="{TOPIC_ID}" />

        <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
        <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

        <!-- BEGIN viewtopic_bottom -->
        {S_TOPIC_ADMIN}
        <!-- END viewtopic_bottom -->
      </p>
  </div>

  <a name="bottomtitle"></a>

  <div class="paged-foot clearfix">
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
    <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> 
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>

</div>

<div class="pun-crumbs">
  <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} »
      <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
  </p>
</div>

<!-- BEGIN promot_trafic -->

<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="main" id="forum_rules">
  <div class="main-head clearfix">
      <p class="h2">{L_FORUM_RULES}</p>
  </div>
  <table class="main-content frm">
      <tr>
        <!-- BEGIN switch_forum_rule_image -->
        <td class="logo">
            <img src="{RULE_IMG_URL}" />
        </td>
        <!-- END switch_forum_rule_image -->
        <td class="rules entry-content">
            {RULE_MSG}
        </td>
      </tr>
  </table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->

<div id="pun-info" class="main">
  <div class="main-content">
      <div id="stats">
        <p>{L_TABS_PERMISSIONS} <br />{S_AUTH_LIST}</p>
      </div>
  </div>
</div>

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.post-entry .entry-content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->
<script type="text/javascript">
$(".poster-info .label:contains('Status')").parent().addClass("status");
$(".poster-link a").attr("href", function () {
  return this.href.replace("[POSTER_NAME]", encodeURI($(this).closest(".poster-info").find(".poster-name strong").text()));
});
</script>

Css:
Code:
/* Spoiler + code + quote */
.codebox{background:transparent;border:0 none;margin:0 0 10px;box-shadow: 0px 0px 0px #000!important;border-radius:0px !important}
.codebox dd{background:transparent;margin:0;padding:0}
.codebox > dt{position:relative;background:url(http://i83.servimg.com/u/f83/16/58/89/73/page_w10.png) no-repeat scroll 10px center #777;color:#FFF;border:1px solid #e2e2e2;height:30px;border-bottom-width:0;line-height:26px;padding:2px 10px 0 30px;width:90px}
.codebox dd.cont_code{background:#FFF;max-height:100%;overflow:visible;position:relative;border:1px solid #e2e2e2}
.cont_code > code{overflow:auto;white-space:pre;display:block;line-height:17px;padding:10px}
.codebox.spoiler{border:1px solid #e2e2e2}
.codebox.spoiler > dt{border:0;background:url(http://i83.servimg.com/u/f83/16/58/89/73/icon-a10.gif) no-repeat 10px center #777;width:95.5%}
.codebox > dt:hover{color:#333;background-color:#F2F2F2}
.spoiler_content{color:#333;margin:10px 20px}
blockquote cite{font-size:13px;text-decoration:italic;background:url(http://i83.servimg.com/u/f83/16/58/89/73/commen10.gif) no-repeat left 2px transparent!important;margin:0!important;padding:0 0 3px 20px;font-weight:bold;}
blockquote{border:1px solid!important;border-color:#DDD!important;color:#333;position:relative;margin:0 0 10px 10px;padding:10px 15px!important;background:transparent!important}
blockquote:before{content:'';display:inline-block;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid #CCC;position:absolute;top:10px;left:-10px}
blockquote:after{content:'';display:inline-block;border-top:9px solid transparent;border-bottom:9px solid transparent;border-right:9px solid #fff;position:absolute;top:11px;left:-9px}
/*view devs bản ngang*/
.pun .postbody{background:#fff!important}
.postfoot{margin-left:0px!important}
.dropRight,.dropRight *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.pun .post .user{overflow:visible;margin-left:-13em;width:12em}
.pun .postmain{margin-left:-1px}
.pun .post:hover{border-left:1px solid #359bed;margin-left:-1px}
.dropRight{z-index:10;position:relative;background:transparent;border:1px solid transparent;width:1px;margin-left:-3px;white-space:nowrap;transition:width .2s;-webkit-transition:width .2s;overflow:hidden;padding:10px 0 10px 13em !important}
.dropRight:hover{background:#fff;width:542px;border-color:#359bed #359bed #359bed #d7d7d7}
.dropRight .poster-avatar{float:left;margin-left:-12em}
.dropRight .poster-avatar a{background:url(http://i56.servimg.com/u/f56/18/59/49/93/noavat10.jpg) no-repeat center #FFF;border:1px solid #DDD;min-height:122px;display:block;width:132px}
.dropRight .poster-avatar img{background:#FFF;min-height:122px;max-height:155px;width:130px;padding:5px}
.dropRight .poster-info{white-space:normal;padding-right:10px;display:none;width:380px}
.dropRight:hover .poster-info{display:block}
.poster-info .poster-field{border:1px dashed #DDD;border-width:1px 0;margin:5px 0;padding:5px 0}
.poster-info .poster-field p{line-height:20px;color:#999;width:180px;display:inline-block}
.poster-info .poster-field p.status{font-style:italic;width:100%;color:#0085FF}
.poster-info .poster-field p.status .label{font-weight:700}
.poster-connect{display:inline-block;width:27px;height:16px;background:url(http://i48.servimg.com/u/f48/16/58/89/73/icon_u11.gif) no-repeat transparent}
.poster-connect img{background:#fff}
.poster-rank{float:right;margin-top:-7px}
.poster-link a{padding-right:13px}
.dropRight:hover .poster-info .poster-link{transition-delay:1s;transition:all 0.5s ease; opacity:1;}
.dropRight .poster-info .poster-link{transition:0s; opacity:0;}
.vifuser:hover {box-shadow: -1px 0px 0px #09F}
.vifuser{background:#d7d7d7}
.infovifus{background:#fafafa;width:100%;transition:all 0.5s ease;position:relative}
.xempet:focus + .infovifus{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:hover{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:active{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:focus{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet {outline:none;margin-top: 30px;z-index: 999;border-bottom: 0px!important;-webkit-transform: rotate(270deg);-moz-transform: rotate(270deg);-o-transform: rotate(270deg);transform: rotate(270deg);margin-left: -39px;background: #42a5de;border: 1px solid #008FE2;box-shadow: 0px 0px 0px #000 !important;position: absolute;color: #fff;font-weight: bold;line-height: 20px;}
.petvif {float:left;margin-left: 10px;margin-top: -30px;padding-top: 0px;position: absolute;}
/*VietHoa Button*/.profile_left a{color:#000 !important;font-weight:bold;margin-right:10px}
.paged-head .posting a,.paged-foot .posting a{color:#fff!important;font-weight:bold;margin-right:10px}
.paged-head .options a img,.main-foot .options a img{width:1px;height:1px}
.paged-head .options a,.main-foot .options a{color:#fff!important;font-weight:bold}
.paged-head .posting a img,.paged-foot .posting a img{width:1px;height:1px}
.profile_left img{width:1px;height:1px}
a[href*="mode=quote"],a[href*="mode=editpost"],a[href*="&mode=delete"],a[href*="mode=report"],a[href*="mode=lock&p"],a[href*="modcp?mode=ip&p"]{padding:10px 10px;line-height:23px;background:rgba(0,0,0,.5);font-weight:bold;transition:all 0.2s ease}
a[href*="mode=quote"]:before,a[href*="mode=editpost"]:before,a[href*="&mode=delete"]:before,a[href*="mode=report"]:before,a[href*="mode=lock&p"]:before,a[href*="modcp?mode=ip&p"]:before{color:#fff}
a[href*="mode=quote"]:hover,a[href*="mode=editpost"]:hover,a[href*="&mode=delete"]:hover,a[href*="mode=report"]:hover,a[href*="mode=lock&p"]:hover,a[href*="modcp?mode=ip&p"]:hover{background:rgba(0,0,0,.7)}
a[href*="mode=quote"]:before{content:"» Trích dẫn"}
a[href*="mode=editpost"]:before{content:"∞ Sửa"}
a[href*="&mode=delete"]:before{content:"◘ Xóa"}
a[href*="mode=report"]:before{content:"δ Báo xấu"}
a[href*="mode=lock&p"]:before{content:"Θ Chặn"}
a[href*="modcp?mode=ip&p"]:before{content:"φ Xem IP"}
a[href*="mode=unlock&p"]:before{content:"✓ Cho phép báo xấu"}
a[href*="cp?mode=delete"]:before{content:"✘ Xóa chủ đề"}
a[href*="cp?mode=trash"]:before{content:"⌧ Cho vào sọt"}
a[href*="cp?mode=move"]:before{content:"✄ Di chuyển"}
a[href*="cp?mode=lock"]:before{content:"✇ Khóa chủ đề"}
a[href*="cp?mode=split"]:before{content:"✂ Tách bài viết"}
a[href*="merge?t="]:before{content:"✁ Gộp bài viết"}
a[href*="cp?mode=unlock"]:before{content:"☑ Mở khóa chủ đề"}
a[href*="mode=post_profile"]:after{content:"✍ Viết lên tường"}
a[href*="mode=newtopic"]:before{content:"✑ Tạo chủ đề mới"}
a[href*="mode=reply"]:before{content:"✏ Trả lời chủ đề"}
.paged-head .posting a:nth-of-type(1),.paged-foot .posting a:nth-of-type(1){background:rgba(113,151,80,0.7);padding:15px;border-radius:5px}
.paged-head .posting a:nth-of-type(1):hover,.paged-foot .posting a:nth-of-type(1):hover{background:rgba(113,151,80,1)}
.paged-head .posting a:nth-of-type(2),.paged-foot .posting a:nth-of-type(2){background:rgba(61,142,227,0.7);padding:15px;border-radius:5px}
.paged-head .posting a:nth-of-type(2):hover,.paged-foot .posting a:nth-of-type(2):hover{background:rgba(61,142,227,1)}
.paged-head,.paged-foot{padding:20px!important;background:none!important;border:none!important}
#post_mq1_1,.i_icon_quote,.i_icon_edit,.i_icon_delete,.i_icon_ip{display:none}

Bonus thêm cái khung pet vừa với cái view:
Code:
<fieldset style="width:120px; height:120px; background: url(LINK BACKGROUND) no-repeat bottom; background-size:120px;border:1px solid #969696;"><legend><font color="#969696" ><div style="margin-left:5px">PET NAME</div></legend><img src="PET LINK"/></fieldset>

Hết zồi ~
  Bài viết hay nhất2
thêm cái thanh lv zô cho ẹp =))
  Bài viết hay nhất3
Thì thay cái khung level vào đoạn này:
Code:
{postrow.displayed.POSTER_RPG}

Nhớ chỉnh css cho nó vừa với forum, cẩn thận với đoạn css này:
Code:
.petvif {float:left;margin-left: 10px;margin-top: -30px;padding-top: 0px;position: absolute;}
  Bài viết hay nhất4
ngang nhìn xấu quá
  Bài viết hay nhất5
cái view này nếu thêm chi tiết ở bên phải nữa là đẹp
  Bài viết hay nhất6
Nếu thiếu cái gì thì mọi người cứ thêm vào thôi :)

@Rêu: với méo thì thế này lại đẹp :v
  Bài viết hay nhất7
cho xin tấm ảnh demo.
  Bài viết hay nhất8
Zero wrote:cho xin tấm ảnh demo.
có link demo mà huynh
http://testskinvif.forum.st/t9p15-topic#56,
  Bài viết hay nhất9
À thêm cái lưu ý nữa là méo không hề động chạm tí gì đến js nên khi click vào nút [xêm pết] nó sẽ trượt cái khung profile và phải click ra ngoài nó mới chịu trở lại như cũ. Tại ở đây méo xài :focus nên càng bấm nút [xêm pết] nó càng không chịu về vị trí ban đầu :)
  Bài viết hay nhất10
pet k hiện à Méo
Link nè http://kingprivate.6forum.net/t12-topic
  Bài viết hay nhất11
Thêm pet chưa vậy? Rồi kích hoạt char sheet chưa?
  Bài viết hay nhất12
Méo wrote:Thêm pet chưa vậy? Rồi kích hoạt char sheet chưa?

Thêm pet + kích hoạt char sheet kiểu gì vậy chỉ mình đi
  Bài viết hay nhất13
ở phần modules ấy, lướt hết qua mấy cái mục ở trang đó là biết ấy mà :v
  Bài viết hay nhất14
mình làm tất rồi k được bạn hướng dẫn cụ thể 1 chút đi
  Bài viết hay nhất15
Đầu tiên mở trang quan lý của Admin ra, mở Modules --> [Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Jeux Roleplay Game
--> Fields Management --> Roleplay Game --> Display the character sheet: chọn Có
--> Fields Management --> Fields --> [Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Ajouter Add a field --> Điền thông tin vào và chọn [Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Icon_ok Add a field
--> Generate the sheets --> Bao nhiêu [Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Editer click hết
--> Character sheets --> [Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs Editer mem muốn thêm pet --> Thêm cái đoạn bonus ở trên, tùy biến gì cũng được
The author of this message was banned from the forum - See the message
  Bài viết hay nhất17
Tìm trong box "Đã giải đáp" ấy
The author of this message was banned from the forum - See the message
  Bài viết hay nhất19
View Pun và Php đều như nhau
The author of this message was banned from the forum - See the message
  Bài viết hay nhất21
mình chỉ xin mấy thẻ Devs đang sử dụng: khung quote, code, spoiler, hide..... thì làm thế nào?
  Bài viết hay nhất22
bluehnvn wrote:mình chỉ xin mấy thẻ Devs đang sử dụng: khung quote, code, spoiler, hide..... thì làm thế nào?
chỉ cần chèn cái này vào css
Code:
/* Spoiler + code + quote */
.codebox{background:transparent;border:0 none;margin:0 0 10px;box-shadow: 0px 0px 0px #000!important;border-radius:0px !important}
.codebox dd{background:transparent;margin:0;padding:0}
.codebox > dt{position:relative;background:url(http://i83.servimg.com/u/f83/16/58/89/73/page_w10.png) no-repeat scroll 10px center #777;color:#FFF;border:1px solid #e2e2e2;height:30px;border-bottom-width:0;line-height:26px;padding:2px 10px 0 30px;width:90px}
.codebox dd.cont_code{background:#FFF;max-height:100%;overflow:visible;position:relative;border:1px solid #e2e2e2}
.cont_code > code{overflow:auto;white-space:pre;display:block;line-height:17px;padding:10px}
.codebox.spoiler{border:1px solid #e2e2e2}
.codebox.spoiler > dt{border:0;background:url(http://i83.servimg.com/u/f83/16/58/89/73/icon-a10.gif) no-repeat 10px center #777;width:95.5%}
.codebox > dt:hover{color:#333;background-color:#F2F2F2}
.spoiler_content{color:#333;margin:10px 20px}
blockquote cite{font-size:13px;text-decoration:italic;background:url(http://i83.servimg.com/u/f83/16/58/89/73/commen10.gif) no-repeat left 2px transparent!important;margin:0!important;padding:0 0 3px 20px;font-weight:bold;}
blockquote{border:1px solid!important;border-color:#DDD!important;color:#333;position:relative;margin:0 0 10px 10px;padding:10px 15px!important;background:transparent!important}
blockquote:before{content:'';display:inline-block;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid #CCC;position:absolute;top:10px;left:-10px}
blockquote:after{content:'';display:inline-block;border-top:9px solid transparent;border-bottom:9px solid transparent;border-right:9px solid #fff;position:absolute;top:11px;left:-9px}
bỏ qua 1 lần nhé - vì câu hỏi này cần lập topic mới để xin - còn topic này để dùng và báo lỗi chứ không phải để nhờ vả :)
  Bài viết hay nhất23
anhoang_qn wrote:
bỏ qua 1 lần nhé - vì câu hỏi này cần lập topic mới để xin - còn topic này để dùng và báo lỗi chứ không phải để nhờ vả :)
cảm ơn bạn. nhưng mình test thử thì code bấm vào không chọn tất được...
demo: http://www.cafeht.com/t499-cho-em-xin-code-thong-bao-3-cot
Nó không hoạt động mượt như bên mình. :(
  Bài viết hay nhất24
bluehnvn wrote:
anhoang_qn wrote:
bỏ qua 1 lần nhé - vì câu hỏi này cần lập topic mới để xin - còn topic này để dùng và báo lỗi chứ không phải để nhờ vả :)
cảm ơn bạn. nhưng mình test thử thì code bấm vào không chọn tất được...
demo: http://www.cafeht.com/t499-cho-em-xin-code-thong-bao-3-cot
Nó không hoạt động mượt như bên mình. :(
cái mình đưa chỉ là cái lớp vỏ - muốn click đc thì làm thêm cái này vào : http://www.devs.cf/t16-code-lam-dep-code-voi-google-code-prettify
The author of this message was banned from the forum - See the message
  Bài viết hay nhất26
You cannot reply to topics in this forum