Skymiles Collapsible Divs

Computer Programming Forums : Questions and Answers, Articles, Tutorials, and Code Snippets

Switch to full style
Support for phpbb3 & codemiles styles
Post a reply
Doobie
  • Doobie
  • Posts: 5
  • Joined: Wed Nov 05, 2008 12:26 pm

Skymiles Collapsible Divs

Wed Nov 05, 2008 12:32 pm

Hi im trying too add collapsible divs to my own custom style like this style has but everytime i add them it does,nt just collapse the one div it seem's to collapse my whole forum in one div.



DrRakha
  • DrRakha
  • Posts: 2715
  • Joined: Tue Mar 27, 2007 10:55 pm
  • Location: Earth
  • Website

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 12:39 pm

show me link ,

Doobie
  • Doobie
  • Posts: 5
  • Joined: Wed Nov 05, 2008 12:26 pm

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 12:45 pm

Hi i have just removed the script from my site because it went wrong but im trying to use the script from x-iphone phpbb3 skin and trying to add it too my own style i made but it look's all messed up when i do.
This is the script from the X-iphone style if it help's.

Code:
<script type="text/javascript" src="{T_TEMPLATE_PATH}/scripts.js"></script>
<script type="text/javascript">
// <![CDATA[

function popup(url, width, height, name)
{
   if (!name)
   {
      name = '_popup';
   }

   window.open(url.replace(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
   return false;
}

function jumpto()
{
   var page = prompt('Enter the page number you wish to go to.:', '');
   var perpage = '';
   var base_url = '';

   if (page !== null && !isNaN(page) && page > 0)
   {
      document.location.href = base_url.replace(/&amp;/g, '&') + '&start=' + ((page - 1) * perpage);
   }
}

/**
* Find a member
*/
function find_username(url)
{
   popup(url, 760, 570, '_usersearch');
   return false;
}

/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
   var parent = document.getElementById(id);
   if (!parent)
   {
      eval('parent = document.' + id);
   }

   if (!parent)
   {
      return;
   }

   var rb = parent.getElementsByTagName('input');
   
   for (var r = 0; r < rb.length; r++)
   {
      if (rb[r].name.substr(0, name.length) == name)
      {
         rb[r].checked = state;
      }
   }
}


// ]]>
</script>
<!-- BEGIN forumrow -->
   <!-- IF (forumrow.S_IS_CAT and not forumrow.S_FIRST_ROW) or forumrow.S_NO_CAT  -->
   
   </td>
   </tr>

   </table>
   <div class="round_bottom_left"><div class="round_bottom_right"><div class="round_bottom_center"></div></div></div>
   </td>
   </tr>
   </table>
   <div class="c-f-l"><div class="c-f-r"><div class="c-f-c">&nbsp;</div></div></div>
</div>
<br /><br />
   </div>
   
   <!-- ENDIF -->
   <!-- IF forumrow.S_IS_CAT or forumrow.S_FIRST_ROW or forumrow.S_NO_CAT  -->
      <div id="f_{forumrow.FORUM_ID}_h" style="display:none;">
<div><div class="c-h-l"><div class="c-h-r"><div class="c-h-c"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/maximize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="maximize" /><div class="c-h-title"><h4><!-- IF forumrow.S_IS_CAT --><a class="c-h-link" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></h4></div></div></div></div>
      
      
      <div class="c-f-l"><div class="c-f-r"><div class="c-f-c-2"></div></div></div>
</div>
   <br /><br />
      </div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
      <div><div class="c-h-l"><div class="c-h-r"><div class="c-h-c"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="minimize" /><div class="c-h-title"><h4><!-- IF forumrow.S_IS_CAT --><a class="c-h-link" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></h4></div></div></div></div>

      <table class="tablebg_rl" cellspacing="0" width="100%">
<tr>
   <th colspan="2">{L_FORUM}</th>
   <th width="60">{L_TOPICS}</th>
   <th width="60">{L_POSTS}</th>
   <th width="200" align="left">{L_LAST_POST}</th>
</tr>
</table>
<table class="tablebg" cellspacing="0" width="100%">
<tr>
<td class="inside_padding">
<div class="round_top_left"><div class="round_top_right"><div class="round_top_center"></div></div></div>
<table class="tablebg_round_rl" cellspacing="0" width="100%">
<tr>
<td colspan="5" style="padding:0px;">

   <!-- ENDIF -->
   <!-- IF not forumrow.S_IS_CAT -->
      <!-- IF forumrow.S_IS_LINK -->
   <tr>
         <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
         <td class="row1">
            <!-- IF forumrow.FORUM_IMAGE -->
               <div style="float: {S_CONTENT_FLOW_BEGIN}; margin-{S_CONTENT_FLOW_END}: 5px;">{forumrow.FORUM_IMAGE}</div><div style="float: {S_CONTENT_FLOW_BEGIN};">
            <!-- ENDIF -->
            <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
            
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>
            <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
         </td>
         <!-- IF forumrow.CLICKS -->
            <td class="row2" colspan="3" align="center"><span class="genmed">{L_REDIRECTS}: {forumrow.CLICKS}</span></td>
         <!-- ELSE -->
            <td class="row2" colspan="3" align="center">&nbsp;</td>
         <!-- ENDIF -->
      </tr>
      <!-- ELSE -->
         <tr>
            <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
            <td class="row1">
               <!-- IF forumrow.FORUM_IMAGE -->
                  <div style="float:{S_CONTENT_FLOW_BEGIN};margin-{S_CONTENT_FLOW_END}:5px;">{forumrow.FORUM_IMAGE}</div><div style="float:{S_CONTENT_FLOW_BEGIN};">
               <!-- ENDIF -->
                           <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
                           
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>

            <!-- IF forumrow.MODERATORS -->
                  <p class="forumdesc"><strong>{forumrow.L_MODERATOR_STR}:</strong> {forumrow.MODERATORS}</p>
               <!-- ENDIF -->
               <!-- IF forumrow.SUBFORUMS and forumrow.S_LIST_SUBFORUMS -->
                  <p class="forumdesc"><strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}</p>
               <!-- ENDIF -->
               <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
            </td>
               <td class="row2" align="center" width="50"><p class="topicdetails_pt">{forumrow.TOPICS}</p></td>
         <td class="row2" align="center" width="50"><p class="topicdetails_pt">{forumrow.POSTS}</p></td>
         <td class="row2" align="left" nowrap="nowrap" width="180">
            <!-- IF forumrow.LAST_POST_TIME -->
               
               <p class="topicdetails2">{forumrow.LAST_POST_TIME}</p>
               <!-- IF forumrow.ALTT_LINK_NAME_SHORT --><p><a <!-- IF forumrow.ALTT_STYLE_BOLD or forumrow.ALTT_STYLE_ITALIC or forumrow.ALTT_STYLE_ADV -->style="<!-- IF forumrow.ALTT_STYLE_BOLD -->font-weight: bold;<!-- ENDIF --><!-- IF forumrow.ALTT_STYLE_ITALIC -->font-style: italic;<!-- ENDIF --> <!-- IF forumrow.ALTT_STYLE_ADV -->{forumrow.ALTT_STYLE_ADV2}<!-- ENDIF -->"<!-- ENDIF --> href="{forumrow.U_ALTT_LINK}" title="{forumrow.ALTT_LINK_NAME}">{forumrow.ALTT_LINK_NAME_SHORT}</a></p><!-- ENDIF -->

               <p class="topicdetails">{forumrow.LAST_POSTER_FULL}
                  <a href="{forumrow.U_LAST_POST}">{LAST_POST_IMG}</a>
               </p>
            <!-- ELSE -->
               <p class="topicdetails">{L_NO_POSTS}</p>
            <!-- ENDIF -->
         </td>
         </tr>
      <!-- ENDIF -->
   <!-- ENDIF -->
   <!-- IF forumrow.S_LAST_ROW -->
      </td>
   </tr>

   </table>
   <div class="round_bottom_left"><div class="round_bottom_right"><div class="round_bottom_center"></div></div></div>
   </td>
   </tr>
      </table>
<div class="c-f-l"><div class="c-f-r"><div class="c-f-c">&nbsp;</div></div></div>
</div>
<br /><br />
      </div>
      
   <!-- ENDIF -->
<!-- BEGINELSE -->
   <div><div class="c-h-l"><div class="c-h-r"><div class="c-h-c"><div class="c-h-title"><h4>{L_FORUM}</h4></div></div></div></div>
   <table class="tablebg" width="100%" cellpadding="0" cellspacing="0">
      <td class="row1" colspan="5" align="center"><p class="gensmall">{L_NO_FORUMS}</p></td>
   
   </table>
<div class="c-f-l"><div class="c-f-r"><div class="c-f-c-2">&nbsp;</div></div></div>
</div>
<!-- END forumrow -->


DrRakha
  • DrRakha
  • Posts: 2715
  • Joined: Tue Mar 27, 2007 10:55 pm
  • Location: Earth
  • Website

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 1:02 pm

you can;t just take the forumlist_body.html and use it , remember there may be javascript files are referenced in the the over_al_header.html

here an . my code work for me to do collapse in mileX1.0 style based on subsilver , i wish it help u sir . :tongue:
Code:
<?php  <!-- BEGIN forumrow -->
    <!-- IF (forumrow.S_IS_CAT and not forumrow.S_FIRST_ROW) or forumrow.S_NO_CAT  -->
    <tr><td class="cat-bottom" colspan="5">&nbsp;</td></tr>
    </table>
    <div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c">&nbsp;</div></div></div></div>
    </div>
    <br />
    <!-- ENDIF -->
    <!-- IF forumrow.S_IS_CAT or forumrow.S_FIRST_ROW or forumrow.S_NO_CAT  -->
        <div id="f_{forumrow.FORUM_ID}_h" style="display:none;">
        <div><div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><img style="padding-top:9px;padding-right:6px;float:right;cursor:pointer;" src="{T_THEME_PATH}{$MG_MAX}" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="{L_FORUM}" />
        <div class="tbl-title"><h4><!-- IF forumrow.S_IS_CAT -->
        <a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></h4>
        </div></div></div></div>
        <table class="tablebg" width="100%" cellpadding="0" cellspacing="0">
        <tr><td class="row1"><span class="gensmall">&nbsp;</span></td></tr>
        </table>
        <div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c"></div></div></div></div>
        <br />
        </div>

        <div id="f_{forumrow.FORUM_ID}">
        <script type="text/javascript">
        <!--
        tmp = 'f_{forumrow.FORUM_ID}';
        if(GetCookie(tmp) == '2')
        {
            ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
        }
        //-->
        </script>
        <div><div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><img style="padding-top:9px;padding-right:6px;float:right;cursor:pointer;" src="{T_THEME_PATH}{$MG_MIN}" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="{L_FORUM}" /><div class="tbl-title"><h4><!-- IF forumrow.S_IS_CAT --><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></h4></div></div></div></div>
        <table class="tablebg" width="100%" cellpadding="0" cellspacing="0">
        <tr>
            <th colspan="2">&nbsp;{L_FORUM}&nbsp;</th>
            <th width="50">&nbsp;{L_TOPICS}&nbsp;</th>
            <th width="50">&nbsp;{L_POSTS}&nbsp;</th>
            <th>&nbsp;{L_LAST_POST}&nbsp;</th>
        </tr>
    <!-- ENDIF -->
    <!-- IF not forumrow.S_IS_CAT -->
        <!-- IF forumrow.S_IS_LINK -->
            <tr>
                <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
                <td class="row1">
                    <!-- IF forumrow.FORUM_IMAGE -->
                        <div style="float:{S_CONTENT_FLOW_BEGIN};margin-{S_CONTENT_FLOW_END}:5px;">{forumrow.FORUM_IMAGE}</div><div style="float:{S_CONTENT_FLOW_BEGIN};">
                    <!-- ENDIF -->
                    <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
                    <p class="forumdesc">{forumrow.FORUM_DESC}</p>
                    <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
                </td>
                <!-- IF forumrow.CLICKS -->
                    <td class="row2" colspan="3" align="center"><span class="genmed">{L_REDIRECTS}: {forumrow.CLICKS}</span></td>
                <!-- ELSE -->
                    <td class="row2" colspan="3" align="center">&nbsp;</td>
                <!-- ENDIF -->
            </tr>
        <!-- ELSE -->
            <tr>
                <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
                <td class="row1" width="100%">
                    <!-- IF forumrow.FORUM_IMAGE -->
                        <div style="float:{S_CONTENT_FLOW_BEGIN};margin-{S_CONTENT_FLOW_END}:5px;">{forumrow.FORUM_IMAGE}</div><div style="float:{S_CONTENT_FLOW_BEGIN};">
                    <!-- ENDIF -->
                    <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
                    <p class="forumdesc">{forumrow.FORUM_DESC}</p>
                    <!-- IF forumrow.MODERATORS -->
                        <p class="forumdesc"><strong>{forumrow.L_MODERATOR_STR}:</strong> {forumrow.MODERATORS}</p>
                    <!-- ENDIF -->
                    <!-- IF forumrow.SUBFORUMS and forumrow.S_LIST_SUBFORUMS -->
                        <p class="forumdesc"><strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}</p>
                    <!-- ENDIF -->
                    <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
                </td>
                <td class="row2" align="center"><p class="topicdetails">{forumrow.TOPICS}</p></td>
                <td class="row2" align="center"><p class="topicdetails">{forumrow.POSTS}</p></td>
                <td class="row2" align="center" nowrap="nowrap">
                    <!-- IF forumrow.LAST_POST_TIME -->
                        <p class="topicdetails">{forumrow.LAST_POST_TIME}</p>
                        <p class="topicdetails">{forumrow.LAST_POSTER_FULL}
                            <a href="{forumrow.U_LAST_POST}">{LAST_POST_IMG}</a>
                        </p>
                    <!-- ELSE -->
                        <p class="topicdetails">{L_NO_POSTS}</p>
                    <!-- ENDIF -->
                </td>
            </tr>
        <!-- ENDIF -->
    <!-- ENDIF -->
    <!-- IF forumrow.S_LAST_ROW -->
        <tr><td class="cat-bottom" colspan="5">&nbsp;</td></tr>
        </table>
        <div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c">&nbsp;</div></div></div></div>
        </div>
    <!-- ENDIF -->
<!-- BEGINELSE -->
    <div><div class="tbl-h-l"><div class="tbl-h-r"><div class="tbl-h-c"><div class="tbl-title"><h4>{L_FORUM}</h4></div></div></div></div>
    <table class="tablebg" width="100%" cellpadding="0" cellspacing="0">
    <tr><td class="row1" colspan="5" align="center"><p class="gensmall">{L_NO_FORUMS}</p></td></tr>
    <tr><td class="cat-bottom" colspan="5">&nbsp;</td></tr>
    </table>
    <div class="tbl-f-l"><div class="tbl-f-r"><div class="tbl-f-c">&nbsp;</div></div></div></div>
<!-- END forumrow -->


Doobie
  • Doobie
  • Posts: 5
  • Joined: Wed Nov 05, 2008 12:26 pm

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 1:11 pm

Sorry that's not the forumlist_body.html im tryin to add the script too thats just the script im takin it from.Anyway i've just added it again now it still work's weird but it kinda works here is my own forumlist_body with the script added to it.

Here you can see how it looks messed up http://trancesounds.110mb.com

Code:
<script type="text/javascript" src="{T_TEMPLATE_PATH}/scripts.js"></script>
<script type="text/javascript">
// <![CDATA[

function popup(url, width, height, name)
{
   if (!name)
   {
      name = '_popup';
   }

   window.open(url.replace(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
   return false;
}

function jumpto()
{
   var page = prompt('Enter the page number you wish to go to.:', '');
   var perpage = '';
   var base_url = '';

   if (page !== null && !isNaN(page) && page > 0)
   {
      document.location.href = base_url.replace(/&amp;/g, '&') + '&start=' + ((page - 1) * perpage);
   }
}

/**
* Find a member
*/
function find_username(url)
{
   popup(url, 760, 570, '_usersearch');
   return false;
}

/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
   var parent = document.getElementById(id);
   if (!parent)
   {
      eval('parent = document.' + id);
   }

   if (!parent)
   {
      return;
   }

   var rb = parent.getElementsByTagName('input');
   
   for (var r = 0; r < rb.length; r++)
   {
      if (rb[r].name.substr(0, name.length) == name)
      {
         rb[r].checked = state;
      }
   }
}


// ]]>
</script>
<!-- BEGIN forumrow -->
<!-- IF not forumrow.S_IS_CAT and forumrow.S_FIRST_ROW -->

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a></div>
   <div class="catrs"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/maximize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="maximize" /></div>
</div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- category table setup -->
<table class="tablebg" cellspacing="1" width="100%">
<tr>
   <td class="row1" colspan="5" align="{S_CONTENT_FLOW_END}"><!-- IF not S_IS_BOT and U_MARK_FORUMS --><a class="nav" href="{U_MARK_FORUMS}">{L_MARK_FORUMS_READ}</a><!-- ENDIF -->&nbsp;</td>
</tr>
<tr>
   <th colspan="2">&nbsp;{L_FORUM}&nbsp;</th>
   <th width="50">&nbsp;{L_TOPICS}&nbsp;</th>
   <th width="50">&nbsp;{L_POSTS}&nbsp;</th>
   <th width="220" nowrap="nowrap">&nbsp;{L_LAST_POST}&nbsp;</th>
</tr>
  <!-- ENDIF -->
      <!-- IF forumrow.S_IS_CAT -->
      <!-- IF not forumrow.S_FIRST_ROW -->
</table>
<!-- bottom table setup -->
<div class="catbtm"><img src="{T_THEME_PATH}/images/clear.gif" width="1" height="5" alt="" /></div>
<!-- End bottom table setup -->

<br />

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><!-- IF forumrow.S_IS_CAT --><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></div>
   <div class="catrs"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="minimize" /></div>
</div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- category table setup -->

<table class="tablebg" cellspacing="1" width="100%">
<!-- ELSE -->

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><!-- IF forumrow.S_IS_CAT --><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></div>
   <div class="catrs"></div>
</div>
<!-- category table setup -->

<table class="tablebg" cellspacing="1" width="100%">
  <!-- ENDIF -->

      <tr>
              <th colspan="2">&nbsp;{L_FORUM}&nbsp;</th>
              <th width="50">&nbsp;{L_TOPICS}&nbsp;</th>
              <th width="50">&nbsp;{L_POSTS}&nbsp;</th>
              <th width="220" nowrap="nowrap">&nbsp;{L_LAST_POST}&nbsp;</th>
      </tr>

   <!-- ELSEIF forumrow.S_IS_LINK -->
      <tr>
         <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
         <td class="row2">
            <!-- IF forumrow.FORUM_IMAGE -->
               <div style="float: {S_CONTENT_FLOW_BEGIN}; margin-{S_CONTENT_FLOW_END}: 5px;">{forumrow.FORUM_IMAGE}</div><div style="float: {S_CONTENT_FLOW_BEGIN};">
            <!-- ENDIF -->
            <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>
            <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
         </td>
         <!-- IF forumrow.CLICKS -->
            <td class="row1" colspan="3" align="center"><span class="genmed">{L_REDIRECTS}: {forumrow.CLICKS}</span></td>
         <!-- ELSE -->
            <td class="row1" colspan="3" align="center">&nbsp;</td>
         <!-- ENDIF -->
      </tr>
   <!-- ELSE -->

      <tr>
         <td class="row2" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
         <td class="row2" width="100%">
            <!-- IF forumrow.FORUM_IMAGE -->
               <div style="float: {S_CONTENT_FLOW_BEGIN}; margin-{S_CONTENT_FLOW_END}: 5px;">{forumrow.FORUM_IMAGE}</div><div style="float: {S_CONTENT_FLOW_BEGIN};">
            <!-- ENDIF -->
            <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>
            <!-- IF forumrow.MODERATORS -->
               <p class="forumdesc"><strong>{forumrow.L_MODERATOR_STR}:</strong> {forumrow.MODERATORS}</p>
            <!-- ENDIF -->
            <!-- IF forumrow.SUBFORUMS -->
               <p class="forumdesc"><strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}</p>
            <!-- ENDIF -->
            <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
         </td>
         <td class="row1" align="center"><p class="topicdetails">{forumrow.TOPICS}</p></td>
         <td class="row2" align="center"><p class="topicdetails">{forumrow.POSTS}</p></td>
         <td class="row1" align="left" nowrap="nowrap">
            <!-- IF forumrow.LAST_POST_TIME -->
                                   <!-- IF forumrow.LAST_POST_TIME --><a href="{forumrow.U_LAST_POST}" title="{forumrow.LAST_POST_SUBJECT}">{forumrow.LAST_TOPIC_ICON_IMG}&nbsp;{forumrow.LAST_POST_SUBJECT}</a><br />{L_POST_BY_AUTHOR} {forumrow.LAST_POSTER_FULL} <a href="{forumrow.U_LAST_POST}"> {LAST_POST_IMG}</a><br />{L_POSTED_ON_DATE} {forumrow.LAST_POST_TIME}<!-- ELSE -->{L_NO_POSTS}<!-- ENDIF -->
            <!-- ELSE -->
               <p class="topicdetails">{L_NO_POSTS}</p>
            <!-- ENDIF -->
         </td>
      </tr>
   <!-- ENDIF -->
<!-- BEGINELSE -->
   <tr>
      <td class="row1" colspan="5" align="center"><p class="gensmall">{L_NO_FORUMS}</p></td>
   </tr>
<!-- END forumrow -->
</table>
<!-- bottom table setup -->
<div class="catbtm"><img src="{T_THEME_PATH}/images/clear.gif" width="1" height="5" alt="" /></div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- End bottom table setup -->


DrRakha
  • DrRakha
  • Posts: 2715
  • Joined: Tue Mar 27, 2007 10:55 pm
  • Location: Earth
  • Website

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 4:06 pm

sir , i saw your forum , the style is cool . i want to ask you in something . Do you know javascript .to make what yo
u want to do ,need a knowledge of javascript programming language .
you need to have a javascript function .This script function remove the content of <DIV> when u click on (-) image , and replace (-) image with (+) .And then when you click on the (+) image you fill the content back to the <DIV> .

thanks .

Doobie
  • Doobie
  • Posts: 5
  • Joined: Wed Nov 05, 2008 12:26 pm

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 5:18 pm

Hello i'm able to undertand how to add scripts already made and add them to my site but i don't know how to code in java none at all.

But that is what i am trying to do add a script that is already coded and add to my site but i cannot get it too work properly it either make's my whole forum a collapsible div or none at all.

DrRakha
  • DrRakha
  • Posts: 2715
  • Joined: Tue Mar 27, 2007 10:55 pm
  • Location: Earth
  • Website

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 5:51 pm

Doobie wrote:Hello i'm able to undertand how to add scripts already made and add them to my site but i don't know how to code in java none at all.

But that is what i am trying to do add a script that is already coded and add to my site but i cannot get it too work properly it either make's my whole forum a collapsible div or none at all.


that is because the code of other style may use an javascripts defined there , may be linked in over_all_header .

Doobie
  • Doobie
  • Posts: 5
  • Joined: Wed Nov 05, 2008 12:26 pm

Re: Skymiles Collapsible Divs

Wed Nov 05, 2008 6:47 pm

All of the script is in the one file forumlist_body.html if you look at the top of this file its got the script and link to the script.js file. That's how i can get it too work on my site but not properly im not sure what im doing wrong. I have it sort of working on my site now HERE
Code:
<script type="text/javascript" src="{T_TEMPLATE_PATH}/scripts.js"></script>
<script type="text/javascript">
// <![CDATA[

function popup(url, width, height, name)
{
   if (!name)
   {
      name = '_popup';
   }

   window.open(url.replace(/&amp;/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
   return false;
}

function jumpto()
{
   var page = prompt('Enter the page number you wish to go to.:', '');
   var perpage = '';
   var base_url = '';

   if (page !== null && !isNaN(page) && page > 0)
   {
      document.location.href = base_url.replace(/&amp;/g, '&') + '&start=' + ((page - 1) * perpage);
   }
}

/**
* Find a member
*/
function find_username(url)
{
   popup(url, 760, 570, '_usersearch');
   return false;
}

/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
   var parent = document.getElementById(id);
   if (!parent)
   {
      eval('parent = document.' + id);
   }

   if (!parent)
   {
      return;
   }

   var rb = parent.getElementsByTagName('input');
   
   for (var r = 0; r < rb.length; r++)
   {
      if (rb[r].name.substr(0, name.length) == name)
      {
         rb[r].checked = state;
      }
   }
}


// ]]>
</script>[/b]
<!-- BEGIN forumrow -->
<!-- IF not forumrow.S_IS_CAT and forumrow.S_FIRST_ROW -->

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a></div>
   <div class="catrs"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/maximize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="maximize" /></div>
</div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- category table setup -->
<table class="tablebg" cellspacing="1" width="100%">
<tr>
   <td class="row1" colspan="5" align="{S_CONTENT_FLOW_END}"><!-- IF not S_IS_BOT and U_MARK_FORUMS --><a class="nav" href="{U_MARK_FORUMS}">{L_MARK_FORUMS_READ}</a><!-- ENDIF -->&nbsp;</td>
</tr>
<tr>
   <th colspan="2">&nbsp;{L_FORUM}&nbsp;</th>
   <th width="50">&nbsp;{L_TOPICS}&nbsp;</th>
   <th width="50">&nbsp;{L_POSTS}&nbsp;</th>
   <th width="220" nowrap="nowrap">&nbsp;{L_LAST_POST}&nbsp;</th>
</tr>
  <!-- ENDIF -->
      <!-- IF forumrow.S_IS_CAT -->
      <!-- IF not forumrow.S_FIRST_ROW -->
</table>
<!-- bottom table setup -->
<div class="catbtm"><img src="{T_THEME_PATH}/images/clear.gif" width="1" height="5" alt="" /></div>
<!-- End bottom table setup -->

<br />

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><!-- IF forumrow.S_IS_CAT --><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></div>
   <div class="catrs"><img style="padding-top:10px;padding-right:0px;float:right;cursor:pointer;" src="{T_THEME_PATH}/images/minimize.png" onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}_h','f_{forumrow.FORUM_ID}');" alt="minimize" /></div>
</div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- category table setup -->

<table class="tablebg" cellspacing="1" width="100%">
<!-- ELSE -->

<!-- category table setup -->
<div class="catmain">
   <div class="catls"></div>
   <div class="cattext"><!-- IF forumrow.S_IS_CAT --><a href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a><!-- ELSE -->{L_FORUM}<!-- ENDIF --></div>
   <div class="catrs"></div>
</div>
<!-- category table setup -->

<table class="tablebg" cellspacing="1" width="100%">
  <!-- ENDIF -->

      <tr>
              <th colspan="2">&nbsp;{L_FORUM}&nbsp;</th>
              <th width="50">&nbsp;{L_TOPICS}&nbsp;</th>
              <th width="50">&nbsp;{L_POSTS}&nbsp;</th>
              <th width="220" nowrap="nowrap">&nbsp;{L_LAST_POST}&nbsp;</th>
      </tr>

   <!-- ELSEIF forumrow.S_IS_LINK -->
      <tr>
         <td class="row1" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
         <td class="row2">
            <!-- IF forumrow.FORUM_IMAGE -->
               <div style="float: {S_CONTENT_FLOW_BEGIN}; margin-{S_CONTENT_FLOW_END}: 5px;">{forumrow.FORUM_IMAGE}</div><div style="float: {S_CONTENT_FLOW_BEGIN};">
            <!-- ENDIF -->
            <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>
            <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
         </td>
         <!-- IF forumrow.CLICKS -->
            <td class="row1" colspan="3" align="center"><span class="genmed">{L_REDIRECTS}: {forumrow.CLICKS}</span></td>
         <!-- ELSE -->
            <td class="row1" colspan="3" align="center">&nbsp;</td>
         <!-- ENDIF -->
      </tr>
   <!-- ELSE -->

      <tr>
         <td class="row2" width="50" align="center">{forumrow.FORUM_FOLDER_IMG}</td>
         <td class="row2" width="100%">
            <!-- IF forumrow.FORUM_IMAGE -->
               <div style="float: {S_CONTENT_FLOW_BEGIN}; margin-{S_CONTENT_FLOW_END}: 5px;">{forumrow.FORUM_IMAGE}</div><div style="float: {S_CONTENT_FLOW_BEGIN};">
            <!-- ENDIF -->
            <a class="forumlink" href="{forumrow.U_VIEWFORUM}">{forumrow.FORUM_NAME}</a>
            <p class="forumdesc">{forumrow.FORUM_DESC}</p>
            <!-- IF forumrow.MODERATORS -->
               <p class="forumdesc"><strong>{forumrow.L_MODERATOR_STR}:</strong> {forumrow.MODERATORS}</p>
            <!-- ENDIF -->
            <!-- IF forumrow.SUBFORUMS -->
               <p class="forumdesc"><strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}</p>
            <!-- ENDIF -->
            <!-- IF forumrow.FORUM_IMAGE --></div><!-- ENDIF -->
         </td>
         <td class="row1" align="center"><p class="topicdetails">{forumrow.TOPICS}</p></td>
         <td class="row2" align="center"><p class="topicdetails">{forumrow.POSTS}</p></td>
         <td class="row1" align="left" nowrap="nowrap">
            <!-- IF forumrow.LAST_POST_TIME -->
                                   <!-- IF forumrow.LAST_POST_TIME --><a href="{forumrow.U_LAST_POST}" title="{forumrow.LAST_POST_SUBJECT}">{forumrow.LAST_TOPIC_ICON_IMG}&nbsp;{forumrow.LAST_POST_SUBJECT}</a><br />{L_POST_BY_AUTHOR} {forumrow.LAST_POSTER_FULL} <a href="{forumrow.U_LAST_POST}"> {LAST_POST_IMG}</a><br />{L_POSTED_ON_DATE} {forumrow.LAST_POST_TIME}<!-- ELSE -->{L_NO_POSTS}<!-- ENDIF -->
            <!-- ELSE -->
               <p class="topicdetails">{L_NO_POSTS}</p>
            <!-- ENDIF -->
         </td>
      </tr>
   <!-- ENDIF -->
<!-- BEGINELSE -->
   <tr>
      <td class="row1" colspan="5" align="center"><p class="gensmall">{L_NO_FORUMS}</p></td>
   </tr>
<!-- END forumrow -->
</table>
<!-- bottom table setup -->
<div class="catbtm"><img src="{T_THEME_PATH}/images/clear.gif" width="1" height="5" alt="" /></div>
</div>

      <div id="f_{forumrow.FORUM_ID}">
      <script type="text/javascript">
      <!--
      tmp = 'f_{forumrow.FORUM_ID}';
      if(GetCookie(tmp) == '2')
      {
         ShowHide('f_{forumrow.FORUM_ID}', 'f_{forumrow.FORUM_ID}_h', 'f_{forumrow.FORUM_ID}');
      }
      //-->
      </script>
<!-- End bottom table setup -->


DrRakha
  • DrRakha
  • Posts: 2715
  • Joined: Tue Mar 27, 2007 10:55 pm
  • Location: Earth
  • Website

Re: Skymiles Collapsible Divs

Thu Nov 06, 2008 12:20 pm

what is these tags !!!
Code:
<?php  
  // <![CDATA[

  
// ]]>
   


where i check the source code of your site .
if found only one div with forum id ???
Code:
<?php
<div id="f_15">
        <script type="text/javascript">
        <!--
        tmp = 'f_15';
        if(GetCookie(tmp) == '2')
        {
            ShowHide('f_15', 'f_15_h', 'f_15');
        }
        //-->
        </script>



your problem that your are still using tables to show the forums body , this is wrong here
. you must use divs with forums id to make it works fine.

because in javascript you call the div with id
Code:
<?php
onclick="javascript:ShowHide('f_{forumrow.FORUM_ID}','f_{forumrow.FORUM_ID}


you have to use div instead of using tables to show your forum . look at my code above.
i wish i helped
thanks :grin:

Post a reply
  Related Posts  to : Skymiles Collapsible Divs
 skymiles translation     -  
 skymiles error     -  
 Skymiles [3.04] little? problem     -  
 skymiles v1.0 header change - how to?     -  
 Skymiles Colour Change?     -  
 skymiles Right Sidebar - Issues     -  
Switch to full style

Codemiles.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com


Powered by phpBB © phpBB Group.


Codemiles.com