?
Solved

HTML Drop Down Menu ...Change "Highlight" Color, Down-Arrow, and Go Button

Posted on 2003-03-22
15
Medium Priority
?
1,200 Views
Last Modified: 2012-06-21
Hello,

I've been wrestling for a day on modifying a simple little dropdown box script.  You'd think it would be easy, but nooooooooooooooooo, not in my world!

Okay, here's the deal:

I want to have a simple dropdown menu box, but be able to change the color of the down arrow button on the right, and the "go" button color...but MOST IMPORTANTLY the highlight color.  It seems to me, every one I find on the net is blue.  I just looks awful with my website, and I'd really like to have it compliment it.  My website is www.poshpawz.com  and you can see the color scheme by viewing it.  I also have colored scrollbars which makes everything look put together, so this is very frustrating.

Here's the script I have at present: Forget half of what it says for links etc...I haven't really filled in the specific info yet.  I do have the font colors worked out however.

<form name="a294" style="font-family: Verdana; font-size: 10px; color: #C89675; font-weight: bold" >
<p align="center">
<font color="#FFCC99">Use these quick links or scroll down to using the pictured links&nbsp;
below...</font></p>
<p align="center">
<select name="a969" size="1" style="background-color:#000000; color:#C89675; font-size:10px; font-family:Verdana; font-weight:bold" onChange="displaydesc(document.a294.a969.selectedIndex)">
<option value="Dog Coats Collars Elegant Classy Trendy.htm" selected>Posh Pawz Home</option>
<option value="New Posh.htm">New Posh Designs </option>
<option value="http://freewarejava.com">Renaissance Coats</option>
<option value="http://wired.com">Renaissance Coats II</option>
<option value="http://freewarejava.com/cgi-bin/Ultimate.cgi">Renaissance Coats III</option>
<option value="http://www.msnbc.com">Renaissance Coats IV</option>
<option>Reversible Coats</option>
<option>Weekend Posh</option>
<option>Piddle Coats</option>
<option>Pup Pajamas</option>
<option>Rain Posh</option>
<option>Way Too Coolerz</option>
<option>Signature Collars</option>
<option>Renaissance Collars</option>
<option>Adjustable Collars</option>
<option>Passementerie Trims</option>
<option>Galloon Trims</option>
<option>Jacquard Trims</option>
<option>Metallic Trims</option>
<option>Taffeta Trims</option>
<option>Iridescent Trims</option>
<option>Velvet Trims</option>
<option>Fabrics</option>
<option>Adornments</option>
<option>Hardware</option>
<option>Pricing</option>
<option>How To Order</option>
<option>How to Measure</option>
<option>Contact</option>
<option>Mailing List</option>
<option>About Me</option>
<option>Glam Photos</option>
<option>Posh Pups!</option>
<option>Charity</option>
</select><span style="background-color: #C89675"><input type="button" value="Go"
onClick="parent.right.location=document.a294.a969.options[document.a294.a969.selectedIndex].value" style="font-size: 10px; font-family: Verdana; font-weight: bold"></span> <br>
<span id="descriptions" align="left" style="font:bold 10px Verdana">
</span>
</p>
</form>



<script>


Lastly, I don't know if it's of any help, but my scrollbar color script  is shown below...maybe the color numbers would help.

<style>
BODY {     scrollbar-3d-light-color:#999999;
           scrollbar-arrow-color:#c89675;
           scrollbar-base-color:black;
           scrollbar-dark-shadow-color:#black;
           scrollbar-face-color:#51372f;
           scrollbar-highlight-color:#black;
           scrollbar-shadow-color:black}
</style>

Thanks so much.  I believe I'm going to hear that it isn't possible to fix the flippin' highlight color, but I figured someone would know for sure here.  You all are great!

poshpawz
0
Comment
Question by:poshpawz
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 4
  • 3
  • +2
15 Comments
 

Expert Comment

by:craig_york
ID: 8189587
I don't believe it is possible to change the color of the arrow.

The button is fairly easy to change through css.
<input type="button" value="Go" onClick="parent.right.location=document.a294.a969.options[document.a294.a969.selectedIndex].value" style="font-size: 10px; font-family: Verdana; font-weight: bold; color: Red; background-color: #ffffff;border-bottom: 1px solid #336699; border-left: 1px solid #336699; border-right: 1px solid #336699; border-top: 1px solid #336699; width: 100px;">
0
 

Author Comment

by:poshpawz
ID: 8189782
Thanks Craig I'll try it!  What tho' about the highlight color...that's my biggie!  I hate that blue color we tend to see on all of the dropdown menus...this is what makes me wonder if it's possible...do you know?
0
 

Author Comment

by:poshpawz
ID: 8189785
...also, wouldn't the button be like changing another set of scrollbar colors, but within a frame?  I know I'm showing my ignorance here ;-)
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:poshpawz
ID: 8189813
...because the arrow button when pushed forms another scrollbar, which is that default grey one, which I'd love to change to look like my other ones on the page.  Thanks
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8190094
There is a very good reason why every site you see is using blue (navy actually) for the highlight color.  There is no option.  It is not overridable.  

Cd&
0
 

Author Comment

by:poshpawz
ID: 8190208
sigh........I was afraid of that...what about the scrollbar/arrow colors?
0
 

Expert Comment

by:craig_york
ID: 8190247
The format below works for IE window Scrollbars, but doesn't look like it carries to the Select object.


BODY {scrollbar-face-color:#ffffff;scrollbar-highlight-color:#000055;scrollbar-3dlight-color:#ecf0ff;
scrollbar-darkshadow-color:#ecf0ff;scrollbar-shadow-color:#000055;scrollbar-arrow-color:#000055;
scrollbar-track-color:#c9ddff;}
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
ID: 8190270
Nope afraid not.  The stling of selects is very limited.  The options will accept styling for color and background-color an that is about it.  The navy highlight still overrides adn background color applied to an option.

CD&
0
 
LVL 6

Expert Comment

by:mattjp88
ID: 8191961
what you could do is make your own drop down.  you would use layers to make them  then you could highlight the backround when you mouse over.

matt :-)
0
 
LVL 14

Expert Comment

by:avner
ID: 8208683
Check this :
http://webfx.eae.net/dhtml/combobox/combobox.htm

Click the demo link
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 8820592
This question has been classified abandoned. I will make a recommendation to the
moderators on its resolution in a week or two. I appreciate any comments
that would help me to make a recommendation.

<note>
Unless it is clear to me that the question has been answered I will recommend delete.  It is possible that a Grade less than A will be given if no expert makes a case for an A grade. It is assumed that any participant not responding to this request is no longer interested in its final disposition.
</note>

If the user does not know how to close the question, the options are here:
http://www.experts-exchange.com/help/closing.jsp


Cd&

0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 9015871
It is time to clean this abandoned question up.

I am putting it on a clean up list for CS.

<recommendation>
points to COBOLdinosaur

</recommendation>

If anyone participating in the Q disagrees with the recommendation,
please leave a comment for the mods.

Cd&

0
 
LVL 6

Expert Comment

by:mattjp88
ID: 9112395
weird, i got 2 notifs saying that an answer was accepted, one by Cd& and the other craig_york.
0
 

Expert Comment

by:craig_york
ID: 9113162
Could someone explain why I received an e-mail saying my answer was excepted, but on checking it was not.  Did someone change their mind?
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 9113699
I also got two notifs one that an answer was accepted and one Good Answer!

My best guess is the mod click on a wrong comment when they were procesing it, and had to correct it.

Cd&
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question