Advertise Here

Author Topic: [Code] Drop Down Menu - With Different Background Colors for the List  (Read 14261 times)

0 Members and 1 Guest are viewing this topic.

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
This is a normal drop down menu, however you can change the colors of the background in the list.  Replace each instance of #FFFFFF  with the color code of your choice.

value=#          (replace # with the address you want them to go to when you click on an item in the list)
---Menu---       (replace with the name you want for the item in the list)

Leave ---Menu--- on the first line and it will show Menu on the drop down when not in use.
(change to whatever wording you prefer)



Code: [Select]

<form name="color">
<select name="menu"

onChange="location=document.color.menu.options[document.color.menu.selectedIndex].value;"
value="GO">

<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>

</select>
</form>



If you would prefer the links to open in another window do the code this way instead:

Code: [Select]
<form name="form1">
<select name="menu" onChange="window.open(document.form1.menu.options[document.form1.menu.selectedIndex].value);">

<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>

</select>
</form>
« Last Edit: September 02, 2008, 12:13:04 am by simply sibyl »

Offline TigerBeachMom

  • SMF For Free Newbie
  • *
  • Posts: 4
    • View Profile

  • Total Badges: 9
    Badges: (View All)
    Topic Starter Combination Level 2 Level 1 First Post
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #1 on: September 25, 2007, 01:03:57 pm »
Correct

The drop down menus are there but the links aren't working.  The first drop down worked once and then it stopped working.  I'm totally lost now.  Wish Calgon would come take me away right about now.  Any suggestions? 

Some how I managed to alter my style sheet to get it exactly how I wanted it but I can't manage a drop down box.  ;D ;D  Yep, I'm brand spanking new to this world.  ;D ;D
« Last Edit: September 27, 2007, 11:19:00 am by TigerBeachMom »

Offline Mary

  • SMF For Free Sr. Member
  • *
  • Posts: 434
    • View Profile
    • PogoJustPogo

  • Total Badges: 15
    Badges: (View All)
    Topic Starter Combination Level 3 Level 2 Level 1
Forum Url: http://pogoinslowmo.smfforfree.com

I know this is an old topic, but I do need help.  I can get the drop down box to work just fine, but can only get one to work at a time.  If I put in two drop downs, then neither of them work.  I used the original code posted by Sibyl, which is

Code: [Select]
<!-- Begin Colored Drop Down Menu -->

<form name="color">
<select name="menu"

onChange="location=document.color.menu.options[document.color.menu.selectedIndex].value;"
value="GO">

<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>
<option style="background-color: #FFFFFF" value="#">---Menu---</option>

</select>
</form>

Do I need to change something or add something with wanting to have two of them so they don't get confused and not work at all?  I even tried putting  <!-- Begin Colored Drop Down Menu 1-->  and  <!-- Begin Colored Drop Down Menu 2 -->, but that didn't work either.
Any suggestions or help will be greatly appreciated.
Vist us at www.pogojustpogo.smfforfree3.com
Best and Friendliest Pogo FanSite There Is!!

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
Hi Red.  Yep its getting confused.  You need to name each one differently if you use more then one.

Do the first part of the 2nd one this way and they will both work for ya

Code: [Select]
<form name="color2">
<select name="menu2"

onChange="location=document.color2.menu2.options[document.color2.menu2.selectedIndex].value;"
value="GO">

Offline Mary

  • SMF For Free Sr. Member
  • *
  • Posts: 434
    • View Profile
    • PogoJustPogo

  • Total Badges: 15
    Badges: (View All)
    Topic Starter Combination Level 3 Level 2 Level 1
Thank you Sib.  I knew it couldn't be too difficult, but I couldn't figure out what to change.  Thanks so much hun, you know you are always my hero.   :smitten:
Vist us at www.pogojustpogo.smfforfree3.com
Best and Friendliest Pogo FanSite There Is!!

Offline Stitch

  • SMF For Free Full Member
  • *
  • Posts: 213
  • VMK will always remain in my heart.
    • View Profile
    • Project: Phoenix

  • Total Badges: 14
    Badges: (View All)
    Topic Starter Combination Level 3 Level 2 Level 1
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #5 on: September 01, 2008, 09:49:20 pm »
and here is stitch with yet another near impossible to answer question! lets hear it now.

Is there anyway i can make it so its a tab

whoo thats all for now

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #6 on: September 01, 2008, 10:50:46 pm »
and here is stitch with yet another near impossible to answer question! lets hear it now.

Is there anyway i can make it so its a tab

whoo thats all for now

If you are wanting to use Custom Tabs so that you click on the tab or mouseover the tab and have a dropdown box -  NO.   You can not put code there, only a url... so there would not be a way to do that.

You could do something in your header like put a tab at the top of your forum and use a dropdown menu script - that'ld work  - sent ya a pm to show ya what i mean

« Last Edit: September 01, 2008, 11:12:56 pm by simply sibyl »

Offline clairebear

  • SMF For Free Master
  • *
  • Posts: 1019
    • View Profile

  • Total Badges: 23
    Badges: (View All)
    Fifth year Anniversary Search Level 5 1000 Posts Poll Voter
whats a drop down menu?
Would it go to each catergory?
and this comes up where?
Im really confused
www.teardrop.mysmf.com

A support forum for support in loss from early miscarriage to five years.

Offline Andrew

  • Helpers
  • *
  • Posts: 2060
  • Andrew at your service
    • View Profile
    • Alabama Weather Prediction

  • Total Badges: 32
    Badges: (View All)
    10 Poll Votes Level 6 Eighth year Anniversary Seventh year Anniversary Sixth year Anniversary
whats a drop down menu?
Would it go to each catergory?
and this comes up where?
Im really confused

A drop-down menu is exactly how it sounds, its a menu that will drop-down with options when you click the down-arrow on it.

If you place the code in your header, it will show up at the top. If you place it in the fotter, it shows up in the bottom.

You can also place it in an EzPortal block so you can have it show up where ever you would like. :)

Offline clairebear

  • SMF For Free Master
  • *
  • Posts: 1019
    • View Profile

  • Total Badges: 23
    Badges: (View All)
    Fifth year Anniversary Search Level 5 1000 Posts Poll Voter
that sounds cool
i think ive tried this b4 tho and tried to make it go to catergories on the forum but it ddint work
did i do something wrong or is this the case?
www.teardrop.mysmf.com

A support forum for support in loss from early miscarriage to five years.

Offline clairebear

  • SMF For Free Master
  • *
  • Posts: 1019
    • View Profile

  • Total Badges: 23
    Badges: (View All)
    Fifth year Anniversary Search Level 5 1000 Posts Poll Voter
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #10 on: July 20, 2009, 11:42:40 am »
hmm it ses it has to go to address so i take it it cant drop down catergories as catergories dont have addresses lol
so what would this be used for/
To send people to other sites?
xx
www.teardrop.mysmf.com

A support forum for support in loss from early miscarriage to five years.

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #11 on: July 20, 2009, 12:01:43 pm »
clair - You set up the options in the dropdown box to go to whatever url's you want.  If I am reading you correctly you wondered if it could be used to make a dropdown box that has your forum's categorys in it?   Yes you can.   When you click on one in the dropdown box it will take you to that area on the forum where that Category is - not inside it.   Since you are using images for the Category names its a little trickier to get the url for the categorys but it can be done.   Go inside one of the Boards in a Category.   You'll see the image for the Category  in the navigation link at the top (under the tabs)    Right mouse click on the Category name, click Copy Shortcut.

Offline clairebear

  • SMF For Free Master
  • *
  • Posts: 1019
    • View Profile

  • Total Badges: 23
    Badges: (View All)
    Fifth year Anniversary Search Level 5 1000 Posts Poll Voter
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #12 on: August 05, 2009, 03:02:14 am »
copy shortcut dont come up :(
just copy
www.teardrop.mysmf.com

A support forum for support in loss from early miscarriage to five years.

Offline simply sibyl

  • Helpers
  • *
  • Posts: 14347
  • On hiatus
    • View Profile
    • The Tent Dwellers

  • Total Badges: 31
    Badges: (View All)
    Level 6 Poll Voter Webmaster Arcade Highscore Windows User
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #13 on: August 05, 2009, 06:56:45 am »
copy shortcut dont come up :(
just copy

If you put your mouse on top of the link,  right mouse click -   in IE you will see copy shortcut,  in firefox you will see copy link location.

Your  "Welcome to Teardrop" Category would be:
http://www.tdsupport.org/index.php?action=forum#2
« Last Edit: August 05, 2009, 07:11:27 am by simply sibyl »

Offline clairebear

  • SMF For Free Master
  • *
  • Posts: 1019
    • View Profile

  • Total Badges: 23
    Badges: (View All)
    Fifth year Anniversary Search Level 5 1000 Posts Poll Voter
Re: [Code] Drop Down Menu - With Different Background Colors for the List
« Reply #14 on: August 11, 2009, 05:53:08 am »
i went to the boards in admin and went to the catergory n done it there by right clicking on the image is that ok?
i got
http://www.tdsupport.org/index.php?action=manageboards;sa=cat;cat=2
www.teardrop.mysmf.com

A support forum for support in loss from early miscarriage to five years.

 

Related Topics

  Subject / Started by Replies Last post
0 Replies
2883 Views
Last post June 26, 2006, 09:48:46 pm
by webworldx
2 Replies
4882 Views
Last post June 23, 2009, 05:18:57 pm
by Colette Brunel
0 Replies
18834 Views
Last post June 23, 2009, 06:27:54 pm
by simply sibyl
2 Replies
2319 Views
Last post September 16, 2009, 08:56:01 pm
by Simply1Nick
0 Replies
1294 Views
Last post September 15, 2009, 07:54:18 pm
by simply sibyl