skip to content

Professional drop-down #12 png transparency and IE6 select box fix

8th September 2008

3D menu series

model

photograph © george mayer | dreamstime.com

menu © 2008 stu nicholls - cssplay.co.uk


Information

The fourth menu in this series of dropdown menus that use full png to give a 3D translucent effect to the sub menus.

This one one expands on the previous menu to give a method of producing variable width sub menus. In this demo there are 3 different widths of sub menu but it can be adapted have more.

This also has a small run off area in which the mouse can go outside of the menu a little way before it collapses.

In this example IE6 has its own special style for the background images which enables it to correctly display the alpha image transparency.

Tested in IE6, IE7, Firefox, Opera, Safari (PC) and Google Chrome Beta

This menu is probably the most complex one produced to date and as such will require a donation to support CSSplay if you wish to use it.



Donations

A donation to support CSSplay is required for the use of this menu.

Terms and Conditions

This menu can be used subject to the following terms and conditions.

  1. You may use this menu in your 'paid projects' for client websites provided a donation is made to support CSSplay.
  2. You may use this menu as part of an application interface provided a donation is made to support CSSplay.
  3. You may use this menu on personal and commercial websites, again a donation should be made to support CSSplay.
  4. You may NOT place this menu on another site for others to download.
  5. You may NOT redistrubute or resell this menu.
  6. Users agree not to remove or edit the credit notice within the stylesheet, or claim that this menu is their own.
Solution Graphics

Copyright

Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.

1. If you are using this on a personal web site then please add a link back to CSSplay and retain any copyright comment in the stylesheet.
A donation to the 'Support CSSplay' fund would be appreciated.

2. If you are using this on a commercial web site, or as a paying job for a client, then please email me asking for permission - stu{at}cssplay.co.uk and in this case a donation to the 'Support CSSplay' fund is required.

3. If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.


Recommended Sites

CSSplay web design/assistance

"The citroen.co.uk web site uses
CSS Play code for the site drop down menus.
This code works seamlessly in IE 6 & 7, and is an excellent solution to the Creative requirements of the site."

Damon Clark - Brandwidth


Advertise with CSSplay

CSS play pages

CSS (Design) - TOP.ORG

CSS play recommend

Free, practical CSS menus, layouts, and examplesSitegrinderEarn from your site today with Netklix text adsPSD to HTML