Connect With WRD
feed via e-mail
feed via e-mail

Posts Tagged ‘Dropdown’

Makisu is an experimental and very original dropdown menu with a 3D appearance which can fold up and down with a slick effect.

The menu uses CSS 3D and comes as a jQuery plugin which auto-converts any targeted list elements.

Makisu CSS 3D Menu

It has several options for customization like the duration of the animation, shading color, perspective used for the menu and more.

For browsers without CSS 3D support, it falls back to a standard list.

Pop! is a simple but effective jQuery plugin for creating dropdown menus.

It enables you to store any content in a container & shows/hides it with the clicks.

jQuery Simple Dropdown Menu

How to use it?

  • Insert the jquery.pop.js file into your webpage (make sure jQuery is inserted too)
  • Initialize it:

 <script type='text/javascript'>
   $(document).ready(function(){
     $.pop();
   });
</script>

  • Using the preferred pop! class, wrap the content:

<div class="pop">
   any content to display
</div>

That’s it.

JankoAtWarpSpeed is presenting a nice tutorial with source files on creating a beautiful menu similar to Vimeo‘s top menu.

The menu is very functional that, within a limited space, a user can browse the website or search it in detail.

Vimeo-Like Menu

I really like the top navigation implemented on Vimeo.com. First time I saw it I wanted to recreate it.

says JankoAtWarpSpeed. And it is succesfully done (although max. browser compatibility is missing, it is a good resource to start building a such menu).

A demo can be found here.

CSS Drop-Down Menu Framework is a free & cross-browser solution to create good looking menus.

Download package already contains examples but new themes can be created very easily.

Cross Browser CSS Menu

Menus can be transformed by only changing the class name. Available transformations are:

  • horizontal
  • vertical left-to-right
  • vertical right-to-left
  • horizontal linear
  • horizontal upwards.

The framework normally uses only CSS but for IE6, there is a JavaScript file that must be included.

Superfish is an advanced suckerfish menu plugin for jQuery.

It turns a standard CSS dropdown menu and tranforms it to a more powerful one (it gracefully degrades).

jQuery Suckerfish Menu

It supports both horizontal & vertical menus and unlimited sub-menus can be defined.

Considering the menu is generated from a CSS-dropdown menu, every sub can be easily styled too.

Other features of Superfish:

  • Suckerfish-style hover support for IE6.
  • Timed delay on mouseout.
  • Animation of sub-menu reveal.
  • Keyboard accessibility.
  • Indicates the presence of sub-menus by automatically adding arrow images to relevant anchors.
  • Drop shadows for capable browsers – degrades gracefully for Internet Explorer 6. Can disable shadows completely via options object.
  • Can show the path to your current page while the menu is idle.
  • Optional callback functions. The ‘this’ keyword within the handlers you attach will refer to the animated ul sub-menu.
Uptime Robot
feed-holder
FeedBurner
PSD2HTML.com