i

A basic anywidth flyout menu

Back to basics to show how to use the latest techniques to produce a flyout menu with the widths of the sub levels automatically sized to fit the longest text.




i

A droplist menu with a sublist feature

A previous professional droplist menu with the additional feature of a dropline heading with droplists giving extra lists within the same dropdown.




i

A droplist menu with top level images and text/links

A droplist menu using top level blocks containing images with text and links.




i

A fix for a problem with divide lines and sliding doors hover graphics

Fixing a problem when having vertical divide lines between horizontal link and using rollover images.




i

A CSS Fisheye Image Menu

A CSS only version of the popular javascript dynamic menu.




i

A CSS Fisheye Text Menu

A similar menu to the previous image version, but this time using expanding text on mouseover.




i

A dynamic CSS image magnifier

A very simple method of magnifying an image using just CSS




i

A CSS Fisheye Image Menu version 2

Another version of the CSS only fisheye menu, this time with expanding images and associated text.




i

A CSS Fisheye png menu

Adding the use of png images for IE6 and giving a smoother zoom animation




i

An image sliding menu

An experimental menu to explore the possibility of having sliding images on hover




i

A single image zoom

Zooming a single image on hover.




i

A vertical flyout list menu

A vertical menu with a 2 tier flyout and the last tier can contain any information you like including images, text and further links.




i

FINALLY a new CSS only dropdwon meu

Afer all this time there is finally a dropdown menu that doesn't use javascript, table, conditional comments, hacks, extra markup and works in all the major browsers including IE6.




i

New definition list menu

A definition list menu using the new menu system to simplify the styling




i

New vertical slide menu

Using the latest techniques for no hacks menus this is a vertical slide version with all the features of the dropdown menu including tabbing, and the sub list stays open when clicking the top level.




i

New vertical flyout menu

Using the latest techniques for no hacks menus this is a vertical flyout version with all the features of the slide menu including tabbing, and the sub list stays open when clicking the top level.




i

New vertical fly left menu

A fly left version of the previous menu, again with no hacks, table, conditional comments or javascript.




i

New horizontal pullup menu

A horizontal pullup menu to continue with this series, again with no hacks, table, conditional comments or javascript.




i

New horizontal dropdown menu

For those who prefer nested unordered lists for their menus, again with no hacks, table, conditional comments or javascript.




i

Permanent image click gallery

A click gallery in which the large image is permanently on screen until another image is chosen EVEN when refreshing the page.




i

UPDATE to new click to slide vertical menu

Added a click to open and also a reclick to close feature.




i

'max-width' for IE6

A CSS ONLY answer for 'max-width' in IE6. No javascript or Microsoft expressions.




i

Zoom icon with speech bubble

A zoom icon with a popup sub menu in a speech bubble.




i

A dropdown menu in shades of grey and black.

A dropdown menu with top level centered and sub menus dynamic widths to fit the longest text, and all in shades of grey and black.




i

A vertical slide with current page override.

A vertical sliding menu with current page styling and the ability to override the current page style when hovering other items.




i

A CSS image map menu.

A CSS dropdown menu using an image map for the top level items with a rollover state, using just two images.




i

A dropdown menu with current page override.

A dropdown menu with current page styling and the ability to override the current page style when hovering other items.




i

Menu link text, png image replacement with rollover that degrades well with images off etc..

A method of replacing menu link text with rollover png images that works in IE6 and also degrades well when images are of and/or CSS is off.




i

A peculiar IE bug that allows irregular image maps with PNG images

A method of creating irregular shaped image maps with ease exploiting an odd effect when using Microsofts AlphaImageLoader to render background PNG images. Only for IE though.




i

A simple image dropdown menu

A simple method of replacing all text with images in a single level dropdown menu with rollover.




i

A more complex image dropdown menu

A more complex method of replacing all text with images in a single level dropdown menu using individual png images.




i

Previous/Next click gallery

A click gallery using 'Previous' and 'Next' buttons to navigate, in which the large image is permanently on screen until another image is chosen EVEN when refreshing the page. With descriptive text and linking option.




i

Previous/Next preview click gallery

A click gallery using 'Previous' and 'Next' preview images to navigate, in which the large image is permanently on screen until another image is chosen EVEN when refreshing the page. With descriptive text and linking option.




i

Gallery with sliding thumbnail images

A click gallery using a sliding set of thumbnail images to navigate. The large image is permanently on screen until another image is chosen EVEN when refreshing the page. With descriptive text and linking option.




i

Gallery with vertical sliding thumbnail images

The previous gallery but with the thumbnails arranged vertically instead of horizontal.




i

Image information dropdown menu

A dropdown menu using top level png images with the submenu used for image information.




i

Multi-level, multi-line flyout menu

A simple multi-level flyout menu with fixed widths and multi-line text.




i

Multi-level, multi-line dropdown menu

A dropdown version of the previous multi-line flyout menu




i

Simple anywidth flyout menu with breadcrumb trail

A simple anywidth CSS flyout menu with an easy method of having a breadcrumb trail.




i

Single level dropdown button menu

Using the no hacks dropdown system and a little extra styling to produce a dropdown button menu with highlight on hover.




i

Multi-column flyout menu

A vertical flyout menu with multi column lists ans opacity.




i

No hacks multi level flyout menu

The no hacks, no javascript, no tables and no conditional comments flyout menu with tabbing.




i

CSS play's 'Clickbox'

CSS play's 'Clickbox' version of Lightbox that now works in Safari(PC) and Google Chrome.




i

Using CSS play's 'Clickbox'

A practical use of CSS play's 'Clickbox'. A CSS only version of Lightbox that now works in Safari(PC) and Google Chrome.




i

CSS play's 'Slideshow'

A revised and simplified 'Slideshow' that now eorks in Safari(PC) and Chrome.




i

Totally NEW 'Push-Pull' sub line menu system

A dropline menu using a totally NEW method that requires NO hacks and works in all browsers. Also allows tabbing.




i

'Pullover' sub line menu

Using the same NEW method as the previous menu to have the sub line appear above the top level links.




i

Image dropdown menu - no hacks

Using the latest no hack system to have top level images and dropdown boxes cntaing images and text




i

'Showup' sub line menu

Using the same NEW method as the previous menu to have the sub line appear above the top level links. This one has simpler styling.




i

CSS3 slide menu

Using CSS3 styles to produce an animated slide down/up menu identical to javascript versions.