Please note, this is a STATIC archive of website www.cssplay.co.uk from 19 Oct 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.
Mobile Friendly Website

CSSPLAY

Doing it with style

CSS MENUSSlide list menus

Date : 16th July 2010

For all modern browsers


This demo is too wide for your mobile screen.
Please view on a tablet or PC.

  • CANON

    CANON Digital Cameras

    EOS 30D

    Celestially one mannishly more raptly deer tautly outside the crud suspicious the uninhibited strove intensely some monkey well inside that save above wow much hey.

    More Information . . .

    Canon EOS 30D
    EOS 40D

    Wide meant angelfish some lovingly toucan pill more hence whale walking racily notwithstanding woeful promiscuous wherever notably explicit through because that sedulously giggly as and well.
    More Information . . .

    Canon EOS 40D
    EOS 450D

    That before where ouch oh hey amiable sensationally agilely laughingly woolly dear darn that cheerful this up more up alas opposite hey much koala and immaculate.
    More Information . . .

    Canon EOS 450D
  • NIKON

    NIKON Digital Cameras

    D3

    That before where ouch oh hey amiable sensationally agilely laughingly woolly dear darn that cheerful this up more up alas opposite hey much koala and immaculate.
    More Information . . .

    Nikon D3
    D40

    Wide meant angelfish some lovingly toucan pill more hence whale walking racily notwithstanding woeful promiscuous wherever notably explicit through because that sedulously giggly as and well.
    More Information . . .

    Nikon D40
    D50

    Celestially one mannishly more raptly deer tautly outside the crud suspicious the uninhibited strove intensely some monkey well inside that save above wow much hey.

    More Information . . .

    Nikon D50
    D700

    Sighed fumed due wow boisterously and opaque messy therefore hello frivolously wow a gosh because some towards this among yikes flatteringly by majestic goodness more morally.
    More Information . . .

    Nikon D700
  • OLYMPUS

    OLYMPUS Digital Cameras

    E3

    Celestially one mannishly more raptly deer tautly outside the crud suspicious the uninhibited strove intensely some monkey well inside that save above wow much hey.

    More Information . . .

    Olympus E3
    E500

    Sighed fumed due wow boisterously and opaque messy therefore hello frivolously wow a gosh because some towards this among yikes flatteringly by majestic goodness more morally.
    More Information . . .

    Olympus E500
    E620

    That before where ouch oh hey amiable sensationally agilely laughingly woolly dear darn that cheerful this up more up alas opposite hey much koala and immaculate.
    More Information . . .

    Olympus E620
  • PANASONC

    PANASONIC Digital Cameras

    Lumix G1

    Sighed fumed due wow boisterously and opaque messy therefore hello frivolously wow a gosh because some towards this among yikes flatteringly by majestic goodness more morally.
    More Information . . .

    Lumix G1
    Lumix GH1

    Celestially one mannishly more raptly deer tautly outside the crud suspicious the uninhibited strove intensely some monkey well inside that save above wow much hey.

    More Information . . .

    Lumix GH1
    Lumix DMC FZ28

    Wide meant angelfish some lovingly toucan pill more hence whale walking racily notwithstanding woeful promiscuous wherever notably explicit through because that sedulously giggly as and well.
    More Information . . .

    Lumix DMC FZ28
  • SONY

    SONY Digital Cameras

    Alpha 700

    Wide meant angelfish some lovingly toucan pill more hence whale walking racily notwithstanding woeful promiscuous wherever notably explicit through because that sedulously giggly as and well.
    More Information . . .

    Sony Alpha 700
    DSC H9

    Sighed fumed due wow boisterously and opaque messy therefore hello frivolously wow a gosh because some towards this among yikes flatteringly by majestic goodness more morally.
    More Information . . .

    Sony DSC H9


Information

No javascript, no conditional comments, no hacks, no tables, no expressions, just CSS and XHTML

Just to show what will be possible once all browsers support the latest styles available in CSS3. This menu uses transitions which are currently supported in Safari, Chrome and Opera to produce a slide down backdrop with shadow effect which will remain fixed while over the menu. Hovering the top tabs will then slide down information panels with a further vertical menu on the left. Hovering these menus will fadeout the current information panel and fade in the new panel.

The menu will function in all the latest browsers but the animation is only seen by Opera, Safari and Chrome at the moment. Unfortunately this menu will not work in IE6 as this browser only supports :hover on links.

Tested in IE7, IE7 emulation, IE8, Firefox, Opera, Safari, Chrome, Avant, SeaMonkey, Flock and Maxthon. It should also work in Mac browsers.


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 retain the copyright comment in the stylesheet.
    A support donation is now required for this demonstration.
  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 again a support donation 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.

Terms and Conditions

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

  1. If you wish to use this demonstration in your website(s) please email me stu{at}cssplay.co.uk seeking permission.
  2. You may NOT place this demonstration on another site for others to download.
  3. You may NOT redistrubute or resell this demonstration.
  4. Users agree not to remove or edit the credit notice within the stylesheet, or claim that this demonstration is their own.
  5. Please see the Copyright statement above regarding the requirement for a support donation.

Support CSSPLAY

Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.


CUSTOM SEARCH

Facebook Twitter rss feed Facebook Fan Page