[Giúp đỡ]Đóng mở cột menu giống blog CP

[Lowie]

Mình thấy bên http://blogger.chinhphuc.info/ có đóng mở cột rất hay và 4rum mình cũng đang dùng dạng đó nhưng không đóng mở như vậy nên mong ai view hộ hoặc admin bên đó share được k
Demo:
Mình cũng dùng kiểu đóng mở cột kiểu đó ở bên http://help.forumotion.com/ nhưng không hiệu quả

[handsomevip007]

Tham khảo http://diendan.chinhphuc.info/t22405-topic

[IceFox]

Làm theo cách của miamor cũng được. Còn cách của mình thì đơn giản hơn: cho hai cột trong thẻ td cùng một table. Sử dụng giá trị %. Khi ẩn cột nào thì cột kia sẽ tự động dàn ra.

Code:

<table width="100%">
<td width="100%" valign="top">
  {BOARD_INDEX}
</td>
<td width="30%" valign="top">
Nội dung cột bên phải
</td>
</table>

Sau đó dùng js nào ẩn cột bên phải đi là được

[ruby-coding]

Làm theo cách của miamor cũng được. Còn cách của mình thì đơn giản hơn: cho hai cột trong thẻ td cùng một table. Sử dụng giá trị %. Khi ẩn cột nào thì cột kia sẽ tự động dàn ra.

Code:

<table width="100%">
<td width="100%" valign="top">
  {BOARD_INDEX}
</td>
<td width="30%" valign="top">
Nội dung cột bên phải
</td>
</table>

Sau đó dùng js nào ẩn cột bên phải đi là được

hướng dẫn chi tiết đi đại ca

[Lowie]

Làm theo cách của miamor cũng được. Còn cách của mình thì đơn giản hơn: cho hai cột trong thẻ td cùng một table. Sử dụng giá trị %. Khi ẩn cột nào thì cột kia sẽ tự động dàn ra.

Code:

<table width="100%">
<td width="100%" valign="top">
  {BOARD_INDEX}
</td>
<td width="30%" valign="top">
Nội dung cột bên phải
</td>
</table>

Sau đó dùng js nào ẩn cột bên phải đi là được

HD đi bạn

Mình chèn cột đó vào index_box nên mong IceFox chỉnh giúp với:
Index_box

Code:

<div class="main paged" style="float: left; width: 670px; padding-right: 5px;">
<div class="pun-crumbs">
  <p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
  <!-- BEGIN tablehead -->
      <div class="main-head">
        <div class="page-title"><h2>{catrow.tablehead.L_FORUM}</h2></div>
      </div>
      <div class="main-content">
        <table cellspacing="0" class="table">
         
              <tr>
               
              </tr>
           
            <tbody class="statused">
  <!-- END tablehead -->

  <!-- BEGIN forumrow -->
              <tr>
                <td class="tcl" style="padding-right: 0px; {catrow.forumrow.INC_LEVEL_RIGHT}; padding-left: 65px;">
                    <span class="status" style="margin-right: -{catrow.forumrow.INC_WIDTH_ICON}; margin-left: -47px;">
                        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                    </span>
                    <h{catrow.forumrow.LEVEL} class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
                    <br />
                    {catrow.forumrow.FORUM_DESC}
                  <div class="nodeStats pairsInline">
                    <br />
            <dl>
               <dt>Đề tài:</dt> <dd>{catrow.forumrow.TOPICS}</dd>
               <dt>Bài viết:</dt> <dd>{catrow.forumrow.POSTS}</dd>
            </dl>
            
         </div>
                    <!-- BEGIN switch_moderators_links -->
                    <br />
                    {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                    <!-- END switch_moderators_links -->
                    {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                    <strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
                  </td>
                  <td class="tcr">
                    <span>
                    <!-- BEGIN switch_topic_title -->
                    Mới nhất:<a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                    <!-- END switch_topic_title -->
                    {catrow.forumrow.USER_LAST_POST}
                    </span>
                  </td>
              </tr>
  <!-- END forumrow -->

  <!-- BEGIN tablefoot -->
            </tbody>
        </table>
      </div>
</br>
<img border="0" src="http://i48.servimg.com/u/f48/16/58/89/73/think10.png" />
  <!-- END tablefoot -->
<!-- END catrow -->
</div>
</div>
                          <div style="float: left; width: 251px;">
                            <br><br><br>
    <div class="module main" style="margin-top: 1em! important;">
 
     
    <div class="main-content">
    <div class="section loginButton">      
   <div class="secondaryContent">
      <label for="LoginControl" id="SignupButton"><a href="index.php?login/" class="inner">Đăng ký ngay!</a></label>
   </div>
</div>
    </div></div>
    <div class="module main" style="margin-top: 1em! important;">
     
 
    <div class="main-content">
<div class="section">
   
      <div class="secondaryContent WidgetFramework_WidgetRenderer_Html" id="widget-6">
         
            <h3>
               
                  Bây giờ là ...
               
            </h3>
            <center><embed src="http://www.clocklink.com/clocks/5012-gray.swf?TimeZone=GMT0700&amp;" width="215" height="75" wmode="transparent" type="application/x-shockwave-flash">
</center>
         

                  </div>
</div>
      </div></div>
     
    <div class="module main" style="margin-top: 1em! important;">
     
 
    <div class="main-content">
     
    <span class="useravatar">
    <img src="https://lh3.googleusercontent.com/-r91FyINo2qc/T5c0-N_b0NI/AAAAAAAAB40/xI5ipFa59tA/d.jpg" alt=""></span></div></div>
     
   
     
   
       
   
           
            </div></div>                 
                                                 
<!-- BEGIN switch_on_index -->
<div class="main-box clearfix">
  <ul>
      <li><a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a></li>
      <li><a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a></li>
      <li><a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a></li>
  </ul>
  <!-- BEGIN switch_delete_cookies -->
  <p class="right">
      <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
  </p>
  <!-- END switch_delete_cookies -->
</div>
<!-- END switch_on_index -->

Index_body:

Code:

{JAVASCRIPT}
<div id="left"><div id="pun-info" class="boxFMvi main"><div class="main-head"><center><div class="page-title"><h2>Tình hình diễn đàn</h2></div></center></div>
 <div class="main-content">
<!-- BEGIN giefmod_index1 -->
{giefmod_index1.MODVAR}
<!-- END giefmod_index1 -->
  </div>
<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
   <ul>
         <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
         <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <li><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a></li>
      <li><a href="{U_MARK_READ}">{L_MARK_FORUMS_READ}</a></li>
   </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 -->

<!-- BEGIN message_admin_index -->
<div class="main">
   <!-- BEGIN message_admin_titre -->
   <div class="main-head">
      <h1 class="page-title">{message_admin_index.message_admin_titre.MES_TITRE}</h1>
   </div>
   <!-- END message_admin_titre -->

   <!-- BEGIN message_admin_txt -->
   <div id="pun-announcement">
      <p>{message_admin_index.message_admin_txt.MES_TXT}</p>
   </div>
   <!-- END message_admin_txt -->
</div>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<div class="main">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username" /></label>  
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password" /></label>  
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>  
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
      <!-- BEGIN switch_fb_connect -->
      <span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
      <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
      <!-- END switch_fb_connect -->
   </div>
</form>
</div>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}
<!-- BEGIN disable_viewonline -->

<!-- TÊN TAB -->
<div id="pun-info" class="main">
  <div class="main-content">
      <div id="tabs_container">
    <ul id="stabs">
        <li class="active"><a href="#tab1">Thống kê</a></li>
        <li><a href="#tab2">Sinh nhật</a></li>
        <li><a href="#tab3">Thông tin</a></li>
    </ul>
</div>
<!-- N?I DUNG TAB -->         
          <div id="tabs_content_container">
    <div id="tab1" class="tab_content" style="display: block;">
       
                  <div id="stats">
        <p class="right">{TOTAL_POSTS}</p>
        <p>{TOTAL_USERS}</p>
        <p>{NEWEST_USER}</p>
      </div>
      <p><div id="onlinelist">
        <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
        <p class="right">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->
            {L_WHO_IS_ONLINE}
            <!-- END switch_viewonline_nolink -->
        </p>
        <p>{TOTAL_USERS_ONLINE}<br />
        {RECORD_USERS}

        <br />
        {LOGGED_IN_USER_LIST}

        {L_ONLINE_USERS}
        {L_CONNECTED_MEMBERS}<br />
        </p>
        <div class="clear"></div>

        <p>{LEGEND} : {GROUP_LEGEND}</p>

      </div></p>
    </div>
    <div id="tab2" class="tab_content">
        <p>{L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
    </div>
    <div id="tab3" class="tab_content">
        <p>Copyright 2012-2014, hauloc2.net</p>
      <p>Design by Zualuoi - Contact: zualuoi@yahoo.com</p>
   
    </div>
</div>
     
      <!-- BEGIN switch_chatbox_activate -->
      <div id="onlinechat">
        <p class="page-bottom">
        {TOTAL_CHATTERS_ONLINE} :
        {CHATTERS_LIST}<br />
        <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
              insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            </script>
        <!-- END switch_chatbox_popup -->
        </p>
      </div>
      <!-- END switch_chatbox_activate -->
  </div>
</div>
<!-- END disable_viewonline -->
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username"/></label>  
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password"/></label>  
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>  
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />
      <!-- BEGIN switch_fb_connect -->
      <span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
      <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
      <!-- END switch_fb_connect -->
   </div>
</form>
<!-- END switch_user_login_form_footer -->

{CHATBOX_BOTTOM}

<!-- BEGIN switch_legend -->
<ul id="pun-legend">
   <li>
      <img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /> {L_NEW_POSTS}
      <img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /> {L_NO_NEW_POSTS}
      <img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /> {L_FORUM_LOCKED}
   </li>
</ul>
<!-- END switch_legend -->

{AUTO_DST}

<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
   appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
    status: true,
    cookie: true,
    xfbml: true,
   oauth: true
});
//]]>
</script>
<!-- END switch_fb_index_login -->

Demo: http://demo.forumvi.com/
Nick + pass test:
ID: test
Pass: testthu1

[IceFox]

Sẽ viết một bài hướng dẫn sau

[Lowie]

Sẽ viết một bài hướng dẫn sau

Đợi chờ lâu quá

[ruby-coding]

share cho anh em dùng đi

[Sponsored content]