• KeyDog
  • KeyDog
  • Global Moderator
  • Offline
  • Registered: 2008-12-12
  • Posts: 1,693

Topic: Hide Show Forum Categories with Jquery

Hide Show Forum Categories with Jquery

based on this:
http://docs.jquery.com/Tutorials:Basic_Show_and_Hide

I'm trying to hide this:
<div id="category1" class="main-content main-category">


would this be correct, and where do I put this code???

 $(document).ready(function() {
   $('#hidecategory1').click(function(){
     $('div.showhide,category1').hide();
   });
   $('#showcategory1').click(function(){
     $('div.showhide,category1').show();
   });
 });

thanks

2 Reply by hcs

  • hcs
  • hcs
  • Administrator
  • Offline
  • Registered: 2006-02-16
  • Posts: 219

Re: Hide Show Forum Categories with Jquery

Code the wrong, second event handler owerload first, and always will work only

 $ (' div.showhide, category1 ').show ()

Use toggle function - http://api.jquery.com/toggle/

 $(document).ready(function() {
   $('#hidecategory1').toggle(
    $('div.showhide,category1').hide(),
    $('div.showhide,category1').show())
 });

hcs's Website

  • KeyDog
  • KeyDog
  • Global Moderator
  • Offline
  • Registered: 2008-12-12
  • Posts: 1,693

Re: Hide Show Forum Categories with Jquery

okay thanks,
but do I wrap it in script tags and add it to index.php

or better :
how do I add it via extension so that I don't have to recode on updates?

4 Reply by hcs (edited by hcs 2010-02-14 03:35)

  • hcs
  • hcs
  • Administrator
  • Offline
  • Registered: 2006-02-16
  • Posts: 219

Re: Hide Show Forum Categories with Jquery

better use of extension.

hcs's Website

  • KeyDog
  • KeyDog
  • Global Moderator
  • Offline
  • Registered: 2008-12-12
  • Posts: 1,693

Re: Hide Show Forum Categories with Jquery

<extension engine="1.0">
    <id>pun_show_hide_category</id>
    <title>Show Hide Category</title>
    <version>0.1</version>
    <description>Shows/Hides Forum Categories.</description>
    <author>...</author>
    <minversion>1.3</minversion>
    <maxtestedon>1.3.4</maxtestedon>
    <dependencies>
        <dependency>jquery</dependency>
    </dependencies>
    <hooks>
    
    <hook id="..."><![CDATA[
      ?>
        <script type="text/javascript">

        $(document).ready(function() {
        $('#hidecategory1').toggle(
        $('div.showhide,category1').hide(),
        $('div.showhide,category1').show())
        });

      </script>
        <?php
        }
        ]]></hook>
        
    </hooks>

</extension>

now my questions:

1. which hook is best for the above?
2. the button tags which in html would be in <body>, where do I add them?

6 Reply by hcs (edited by hcs 2010-02-14 14:11)

  • hcs
  • hcs
  • Administrator
  • Offline
  • Registered: 2006-02-16
  • Posts: 219

Re: Hide Show Forum Categories with Jquery

1)

    <hook id="in_pre_header_load"><![CDATA[

$forum_head['Hide_Categories'] = <<<HTML

        <script type="text/javascript">

        $(document).ready(function() {
        $('#hidecategory1').toggle(
        $('div.showhide,category1').hide(),
        $('div.showhide,category1').show())
        });

      </script>
HTML;

        ]]></hook>

hcs's Website