<html>
<script type="text/javascript">
  function show_hide(o){
    if(o.className == "hidden"){
      document.getElementById('menu').style.display = 'block';
      o.className = "show";
    }else if(o.className == "show"){
      document.getElementById('menu').style.display = 'none';
      o.className = "hidden";
    }
  }
</script>
<a href="#" class="hidden" onclick="show_hide(this)">Bryn Blayne</a>
<div id="menu" style="display: none;">
  <ul>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynabout.htm" TARGET="MAIN">About Me</a></li>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/bryncontact.htm" TARGET="MAIN">Contact</a></li>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynschedule.htm" TARGET="MAIN">Schedule</a></li>
    <li>Pictures</li>
    <li>Videos</li>
  </ul>
</div>
<p>
<script type="text/javascript">
  function show_hide(o){
    if(o.className == "hidden"){
      document.getElementById('menu').style.display = 'block';
      o.className = "show";
    }else if(o.className == "show"){
      document.getElementById('menu').style.display = 'none';
      o.className = "hidden";
    }
  }
</script>
<a href="#" class="hidden" onclick="show_hide(this)">Alexxa Bound</a>
<div id="menu" style="display: none;">
  <ul>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynabout.htm" TARGET="MAIN">About Me</a></li>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/bryncontact.htm" TARGET="MAIN">Contact</a></li>
    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynschedule.htm" TARGET="MAIN">Schedule</a></li>
    <li>Pictures</li>
    <li>Videos</li>
  </ul>
</div>

















</html>

yes someone helped me along time ago with a drop down list they created something for me which is of the following, what i want to do is keep the way it is but add another drop down the same way but open another set of lists for some reason the way i am doing it if i click on either persons name it opens the same list can anyone help me please.

Recommended Answers

well , of course it opens the same list if there is the same text in ever <li> tags, change the text and see if its different.

on a side note, you dont need to have the javascript function twice, both lists will use the same. also you can't have …

Jump to Post

or read up on the son of suckerfish, or superfish menus.

they are reliable and widely used systems.

Jump to Post

yup, thats what i understood also, and this is what the suggested changes will do :)

Jump to Post

All 11 Replies

well , of course it opens the same list if there is the same text in ever <li> tags, change the text and see if its different.

on a side note, you dont need to have the javascript function twice, both lists will use the same. also you can't have both divs with the same "id", change both of them from "menu" to "menubryn" and "menualexxa"

Edit: i just realized the js function uses the id to set the visibility, you can easily adapt that to be used for multiple lists...

you could use loop through child tags of "o" object for a ul tag and set that child's visibility instead of using "document.get~"
you could set the 'class="hidden" ' to the ul instead of the <a> tag and change the onclick call to "show_hide("menu_bryn")" and change the function a bit to search for "document.getElementById(o)" and then check for that object's class name.

try soemthing and come back to me with some code :)

or read up on the son of suckerfish, or superfish menus.

they are reliable and widely used systems.

@philippe, The thing is I want it to look and act like this I will try to explain

I wan to have the name Bryn so that when you click on it it drops down a list

then i want a name of Alexxa so that when you click on it it drops down a list as well

I want each list under each name, for example

and then when you click on the name again it will hide the list.

bryn

item 1
item 2

alexxa

item 1
item 2

yup, thats what i understood also, and this is what the suggested changes will do :)

<html>

<script type="text/javascript">

  function show_hide(o){

    if(o.className == "hidden"){

      document.getElementById('0').style.display = 'block';

      o.className = "show";

    }else if(o.className == "show"){

      document.getElementById('0').style.display = 'none';

      o.className = "hidden";

    }

  }

</script>

<a href="#" class="hidden" onclick="show_hide("menu_bryn")">Bryn Blayne</a>

<div id="menubryn" style="display: none;">

  <ul>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynabout.htm" TARGET="MAIN">About Me</a></li>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/bryncontact.htm" TARGET="MAIN">Contact</a></li>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynschedule.htm" TARGET="MAIN">Schedule</a></li>

    <li>Pictures</li>

    <li>Videos</li>

  </ul>

</div>
<p>
<a href="#" class="hidden" onclick="show_hide("menu_alexxa")">Alexxa Bound</a>

<div id="menualexxa" style="display: none;">

  <ul>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynabout.htm" TARGET="MAIN">About Me</a></li>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/bryncontact.htm" TARGET="MAIN">Contact</a></li>

    <li><a href="file:///C:/Users/Vince/Pictures/kinklive%20fan/brynschedule.htm" TARGET="MAIN">Schedule</a></li>

    <li>Pictures</li>

    <li>Videos</li>

  </ul>

</div>

</html>

These are the changes from what i thought you suggested like i wrote to you im not really clear on javascript so you are speaking spanish to me, but now that i made the changes it doesnt work any more

your gonna want to pass the div's id to the show_hide() function. with the underscore included.

<a href="#" class="hidden" onclick="show_hide("menu_bryn")">Bryn Blayne</a>
<div id="menubryn" style="display: none;">

also, i dont think you have any element with an id="0" in your code, so this line is wrong.

document.getElementById('0').style.display = 'block';

Since you are calling show_hide from the onclick event of the <a> tags and thats the element with a class name hidden or show, you will need to keep in place the mechanism to know who called the function.

function show_hide(o){
 if(o.className == "hidden"){

So basicly, you will now need 2 arguments instead of 1, "this" referencing the <a> tag like it used to do, AND the div's UNIQUE id. this way you will keep the "o.className" stuff, and look for "document.getElementById(id)".

try this and let me know what you come up with!

i appreciate the non helping, i am going to try to see if i can hunt down the person that helped me last time and made the code for me, you may know what your talking about but i don't so thank you

im sorry this is just not the kind of forum you seem to think it is , no hard feelings, and good luck!

no it is the kind of forum i think it is cause someoen was nice enough to help me but your not

if that person person you are talking about spoon-fed you, he was not helping you.

no he didnt spoon feed me but i gave him what i had and he re wrote it for me so that i can see what i was doing wrong, what your telling me is gibbrish all im asking for is help and you cant provide that so just stop responding if you don't want to help

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.19 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.