dougneubauer.com » Drop Down Menu http://dougneubauer.com Web Design, SEO and Online Promotional Videos Mon, 05 Mar 2012 05:39:49 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Mega Menus http://dougneubauer.com/2010/04/mega-menus/ http://dougneubauer.com/2010/04/mega-menus/#comments Mon, 05 Apr 2010 21:44:22 +0000 Doug Neubauer http://dougneubauer.com/?p=11194 Just changed the drop-down menu structure to Mega-Menus!

But what’s a Mega-Menu, you ask?

Well, instead of the old-fashioned drop-down menu with its sub-menus and sub-sub-menus and so forth, Mega-menus have only one drop-down level with all the links on one large menu. See picture below…

megamenu1

Mega-menus are fairly new, and have a number of advantages over the traditional drop-down menu:

  • Everything is visible at once — no scrolling, no submenus.
  • Navigation links can be divided into groups and structured with layout, typography and icons.
  • Easy to maneuver with a mouse.

Usability expert Jakob Nielsen, although he disapproves of drop-down menus in general, likes Mega Drop-Down Menus.

Here’s the definitive article on Making a Mega-Menu, and, with a couple of modifications, is the method this site uses.

One small change is the activation delay time. Jacob Nielsen recommends a delay of 0.5 seconds before activating the drop-down. This seems far too long, a delay of 0.1 seconds feels more natural.

Here are some Mega-Menu Example sites…

Update: 12/15/10: Mega-Menus Gone Wrong — A caveat by Jakob Nielsen

]]> http://dougneubauer.com/2010/04/mega-menus/feed/ 0 Demo Gallery http://dougneubauer.com/2010/04/demo-gallery/ http://dougneubauer.com/2010/04/demo-gallery/#comments Mon, 05 Apr 2010 06:16:23 +0000 Doug Neubauer http://dougneubauer.com/?p=11039 A collection of various demo pages using XHTML, CSS and Javascript.

Contents

Introduction

[Note: This is actually an old page from 2009, that was converted to a blog posting.]

A collection of demo “snippets” of various web design techniques used in previous projects.`

Hover-Light Slideshow

HoverLightSlideShow
This is an adaptation of the standard Hoverbox Image Gallery by Nathan Smith combined with the Lightbox JS by Lokesh Dhakar, with an added Slideshow courtesy of wensheng.com.

The result is here: Hover-Light Slideshow Demo

 

TBD

  • dropdown menus
  • trifecta menus
  • other…

See Also

External Links

]]> http://dougneubauer.com/2010/04/demo-gallery/feed/ 0 YouTube Videos and DropDown Menus http://dougneubauer.com/2010/02/youtube-videos-and-dropdown-menus/ http://dougneubauer.com/2010/02/youtube-videos-and-dropdown-menus/#comments Sat, 20 Feb 2010 17:52:07 +0000 Doug Neubauer http://dougneubauer.com/?p=10421 If you’ve ever had the problem of a Dropdown menu “hiding” behind a Youtube Video, some folks at the BytesForAll Forum came up with a solution…

Here’s an example. Just add the parts highlighted in red and it works!

<object width=”320″ height=”265″>
<param name=”movie” value=”http://www.youtube.com/v/H8v3UnMDC5M&hl=en_US&fs=1&rel=0″></param>
<param name=”allowFullScreen” value=”true”></param>
<param name=”allowscriptaccess” value=”always”></param>
<param name=”wmode” value=”opaque”></param>
<embed src=”http://www.youtube.com/v/H8v3UnMDC5M&hl=en_US&fs=1&rel=0″
type=”application/x-shockwave-flash”
allowscriptaccess=”always”
allowfullscreen=”true”
width=”320″
height=”265″
wmode=”opaque” >
</embed>
</object>

]]> http://dougneubauer.com/2010/02/youtube-videos-and-dropdown-menus/feed/ 0