Results 1 to 3 of 3

Thread: Switch Content Script with "<ul>"

  1. #1
    Join Date
    Feb 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Switch Content Script with "<ul>"

    1) Script Title: Switch Content

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tchcontent.htm

    3) Describe problem:

    EXAMPLE

    I would like to hide/show subclauses in an unordered list at the click of a button. As an amateur I'm making quite a messy job of this as I go along and I'm starting to realise that it makes more sense to try and get a kick in the right direction before I go any further!

    See the EXAMPLE of what my original page looks like here.

    The current HTML looks like this:
    HTML Code:
          <td colspan=2><div id="main text">
    		<ul class="one">
    			<li><strong><a href="http://music.booseytracks.com/search/html/popup_cddetails_i.php?cdkurz=AB-C017128&w=tr&" target=_blanl">Dubby</a></strong> – when describing music, this generally means ‘laden with effects’ and refers to dub reggae, where musicians would create a version of a song and add effects to various elements of it
    			<li><strong>Effects</strong> – types of
    			<ul class="sub">
    				<li><strong>Chorus</strong> – yes, everyone knows that the chorus is the repeated, catchy bit in a song. But did you know that it is also an effect which takes a sound and plays it over itself in a slightly changed way to make it sound like more than one instruments are playing?
    				<li><strong>Delay</strong> – echo that repeats the sound e.g. ECHO-ECHo-ECho-Echo-echo
    				<li><strong><a href="http://music.booseytracks.com/search/html/popup_cddetails_i.php?cdkurz=SCD048829&w=tr&" target="_blank">Phaser/Flanger</a></strong> – The first is not a space-age gun and the second is not at all what you’re thinking. These are effects which put a sound in and out of time with itself creating whooshing and/or space-age sounds
    				<li><strong><a href="http://music.booseytracks.com/search/html/popup_cddetails_i.php?cdkurz=STRP000206&w=tr&" target="_blank">Reverb</a></strong> – echo that sustains the sound e.g. echo-o-o-o-o-o-o
    			</ul>
    			<li><strong><a href="http://music.booseytracks.com/search/html/popup_cddetails_i.php?cdkurz=CAVC0252381&w=tr&" target="_blank">Legato</a></strong> – the opposite of staccato, this means ‘played smoothly’, with the notes joined up like your very best handwriting
    			<li><strong><a href="http://music.booseytracks.com/search/html/popup_cddetails_i.php?cdkurz=CAVC024413&w=tr&" target="_blank">Marcato</a></strong> – Italian for ‘marked’. Every note is played with an emphasis
    where the css is:
    #maintext
    {
    font-size:12px;
    }

    ul.one
    {
    width:70%;
    margin-left:10%;
    font-size:12px;
    list-style-type: disc;
    padding: 0 0 0 20;
    }

    ul.sub
    {
    list-style-type:circle;
    list-style-image:url(dot2.gif);
    marker-offset: 5px;
    }

    I would like to make the <li>s in the "sub" class collapse when you click on 'effects'. I also have other pages where there are a number of these subclauses where I'd like to do the same thing - I realise that I may have to change around the CSS tags and styles etc. (Also I'm not sure why I have a div id called maintext when I can tie that to the main css style )

  2. #2
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    If you're looking to create collapsible UL lists, a much better solution would be something like jQuery TreeView menu. Switch Content script by default handles only 1 level of collapsing content- getting it to work on multiple levels can get messy quick.
    DD Admin

  3. The Following User Says Thank You to ddadmin For This Useful Post:

    bambam (02-12-2009)

  4. #3
    Join Date
    Feb 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Great, thanks for your help! I'll try that then and might get back to you guys if there's a problem.

    Thanks again!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •