The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Producing a nested collapsible list for a sidebar
Melinda
post Mar 7 2012, 11:29 AM
Post #1





Group: Members
Posts: 3
Joined: 6-March 12
Member No.: 16,648



Hi,

Could I get some assistance with producing code for a collapsible list please?

Ive fond some tags/ code but I dont know what the ahref should refer to.

CODE
<ul id="someID">
  <li>The January Garden
    <ul><a href="java script:cl_expcol('ex3');">[+]</a>
      <li><a href="someHref">The lawn</a></li>
      <li><a href="someHref">The Greenhouse</a></li>
      <li><a href="someHref">Vegetables</a></li>
      <li><a href="someHref">FRuit</a></li>
    </ul>
  </li>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
Reply to this topicStart new topic
Replies
Melinda
post Mar 7 2012, 12:24 PM
Post #2





Group: Members
Posts: 3
Joined: 6-March 12
Member No.: 16,648



Cheers for that Pandy! biggrin.gif


About the nesting code- do I need to add that bit of java script at the top to make the list collapse, or can I do without it?

CODE
<ul id="The Gardening Month">
<li><a href="java script:notA();"><p><strong>The January Garden</strong></p></a></li>
    <li>
    <ul>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Vegetable Garden</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Flower Garden</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Fruit Garden</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Greenhouse</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Lawn</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">The Armchair</a></li>
      <li><a href="http://lewishamgardens.webs.com/the-gardening-month">Other Jobs</a></li>
      </ul><p> </p>


This post has been edited by Melinda: Mar 7 2012, 12:45 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 7 2012, 06:55 PM
Post #3


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



If something should happen when something is clicked you need JavaScript. It's easy to find examples.

http://www.google.com/search?q=collapsable%20list%20css
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic


Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 19th March 2024 - 02:14 AM