• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 209
  • Last Modified:

Customise pull down menu

Hi,
   I have just added a pull down menu to my site and was wondering if there is any way that it can be customised to suit my needs?  I would like to change the colour of the menu background and also make the arrow different.  The reason is that I use two iframes on my site and they both have customised scrollbars, and the pull down just doesn't look right.

Thanks,

John.  
0
john-formby
Asked:
john-formby
  • 4
  • 4
  • 2
2 Solutions
 
VirusMinusCommented:
It would help if you could post some code.

If you found the javascript code somewhere, look in the JS file to see if any variables are commented as being related to menu visuals.
0
 
VirusMinusCommented:
Alternately you could use one of these menu's, the code is easy to understand and you can change colours etc. easily -> http://www.brainjar.com/dhtml/menubar/demo3.html
0
 
john-formbyAuthor Commented:
It is just a simple pull down menu.  The link to the site is: http://www.3doubleu.co.uk/test
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.

 
john-formbyAuthor Commented:
I would just like it to take on the same characteristics as the scrollbar for the news section.
0
 
Diablo84Commented:
You can change the background colour using <select name="myselect" style="background-color: #EEE;"> where #EEE is the hex value for the color of your choice.

Remember changing the scroll bar attributes are IE only, any Mozilla or Firefox users will not see the difference so there is not a great amount of purpose behind doing so.
0
 
VirusMinusCommented:
Ok you can do it using CSS; look at the example below ->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
select.shortcuts {background-color:#fff;color:#333;}
.shortcuts-section {background-color:#ebebeb;color:#333;}
/* shortcuts */
shortcuts-block {border-bottom:1px dashed #CCCCCC;border-top:1px dashed #CCCCCC}
shortcuts-text  {margin:6px 6px 6px 6px;}
</STYLE>
</head>

<body>
<FORM NAME="shortcuts" ACTION="#">Quick links:

<SELECT CLASS="shortcuts">
<OPTION>---Select a category---</OPTION>
<OPTION CLASS="shortcuts-section" VALUE="abc.html">Audio visual</OPTION>
<OPTION VALUE="abc.html">&raquo; SECTION</OPTION>
<OPTION VALUE="abc.html">&raquo; aaaaaaaaaaaaaa</OPTION>
<OPTION VALUE="abc.html">&raquo; bbbbbbbbbbbb</OPTION>
<OPTION VALUE="abc.html">&raquo; cccccccccccc</OPTION>
<OPTION VALUE="abc.html">&raquo; ddddddddddd</OPTION>
<OPTION VALUE="abc.html">&raquo; eeeeeeeeeeee</OPTION>
<OPTION VALUE="abc.html">&raquo; fffffffffffffff</OPTION>
<OPTION CLASS="shortcuts-section" VALUE="abc.html">SECTION</OPTION>
<OPTION VALUE="abc.html">&raquo; gggggggggggggg</OPTION>
<OPTION VALUE="abc.html">&raquo; hhhhhhhh hhhhhhh</OPTION>
<OPTION VALUE="abc.html">&raquo; iiiiiiii</OPTION>
<OPTION CLASS="shortcuts-section" VALUE="abc.html">SECTION</OPTION>
<OPTION VALUE="abc.html">&raquo; jjjjjjjj jjjj</OPTION>
<OPTION VALUE="abc.html">&raquo; kkkkkkkkk</OPTION>
<OPTION CLASS="shortcuts-section" VALUE="abc.html">SECTION</OPTION>
<OPTION VALUE="abc.html">&raquo; mmmmmmmm</OPTION>
<OPTION VALUE="abc.html">&raquo; nnnnnnnn</OPTION>
<OPTION VALUE="abc.html">&raquo; oo ooooooo</OPTION>
<OPTION VALUE="abc.html">&raquo; pppppp-pppppppp</OPTION>
<OPTION VALUE="abc.html">&raquo; qqqqq qqqqqqqq qqqq</OPTION>
</SELECT>
</FORM>
</body>
</html>
0
 
VirusMinusCommented:
and Diablo84 is right, you can't get the same effects cross browser
0
 
john-formbyAuthor Commented:
I know that it only works in IE.  The reason I want it is cause then it will all look the same in IE, but if it is used in Mozilla, then it will use the default for that and then it will still all folow the same pattern.  I just want it to be standard whatever browser is used.  Don't know if I have explained this very well.

Thanks for the CSS post, I shall have a look at this now :-)

John.
0
 
john-formbyAuthor Commented:
I have changed the menu so that it now has a different background colour, but is there any way to change the arrow and border colours so that it looks like the scrollbars.  I have tried using the css scrollbar properties but that doesn't work.  Any suggestions welcome.

John.
0
 
Diablo84Commented:
AFAIK you can't, as i recall scroll bars in things like text areas inherit their appearence from the main scroll bar but again this is all an IE only factor which is not supported by the standards so its a very hit and miss area.
0

Featured Post

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.

  • 4
  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now