10 Fresh jQuery Tutorials to Enhance Navigation Menus

By / Oct 15, 2009 / Tutorials
shares

A few years ago, when designers wanted to add cool effects to the navigation of a website they used Flash. We all know the types of problems that caused. Now with the growing popularity of javascript frameworks like jQuery, those same types of “Flash-like” effects can be achieved without Flash. Here are 10 jQuery tutorials and techniques to enhance your website’s navigation and menus.

Horizontal Scroll Menu with jQuery Tutorial

jquery navigation

BBC Radio 1 Zoom Tabs

jquery navigation

Spritemenu

jquery navigation

Outside the Box Navigation with jQuery

jquery navigation

Sexy Drop Down Menu w/ jQuery & CSS

jquery navigation

A Simple and Beautiful jQuery Accordion Tutorial

jquery navigation

Make a Mega Drop-Down Menu with jQuery

jquery navigation

jQuery look: Tim Van Damme

jquery navigation

jQuery Feed Menus

jquery navigation

Create a Good Looking Floating Menu with jQuery Easing

jquery navigation

About the Author

Henry Jones is a web developer, designer, and entrepreneur with over 14 years of experience. He is the founder of WDL and ThemeTrust.

21 Comments

  1. Mike Smith
    October 15, 2009

    Nice list. the timvandamme one is going to come in handy for the new version of iammikesmith.com I am working on.

    Reply
  2. Andy Feliciotti
    October 15, 2009

    This couldn’t come at a better time, trying to learn jQuery ATM

    Reply
  3. Webstandard-Team
    October 15, 2009

    Nice Collection of jQuery-Navigations. If your interested in some other Navigation-Solutions by jQuery, don’t miss jQuery – The easy way to navigate!

    Reply
  4. Daniel Long
    October 15, 2009

    There are some really good ideas for nav menus in this collection. The first example is one of my favourites, I think it would work well as a menu for an archive of blog posts. Another great example is the ‘Spritemenu’. I really like how when hovering over a button, the darker blue covers the button to highlight where you are. I will definetly be following the tutorials to try and re-create some of these, and try to push the idea further.

    Reply
  5. joão
    October 15, 2009

    I’m absolutelly in love with the first plugin on this showcase.. it’s beautiful! :)

    Reply
  6. joyoge bookmark
    October 15, 2009

    nice list, thanks for share..

    Reply
  7. kevin
    October 15, 2009

    Nice list, thanks!

    Reply
  8. theComplex
    October 15, 2009

    Great list, can’t wait to share!

    Reply
  9. MCEctoCooler
    October 15, 2009

    I was JUST looking for a ‘sexy’ drop down effect when I came across THIS post. Wahoo!

    Reply
  10. Rahul – Web Guru
    October 15, 2009

    Nice one.. downloaded…

    Reply
  11. Chris Morata
    October 15, 2009

    What a great roundup! I will definitely be using some of these with my next project.

    Reply
  12. Bariski | TutZone.net
    October 16, 2009

    I have been your blog reader for quite a long time, as you always share something new, but this post made me to reply. Very nice listing, bookmarked for sure. Thanks.

    Reply
  13. GIVISION | Jiri Mocicka
    October 17, 2009

    Hey folks this is great!
    Really considering premium package ‘-)

    Reply
  14. SOS Media Web Design
    October 19, 2009

    Nice links to some great jQuery nav elements. Thanks!

    Reply
  15. Jeremy
    October 27, 2009

    Great list, but…

    The “Outside the Box with jQuery Navigation” only links to an example. Is that not a packaged download, just an example of what you can do? Thanks.

    Reply
  16. yudhistira
    November 3, 2009

    nice, thank you for the tutorial :)

    you’re absolutely fantastic :)

    Reply
  17. Seb
    November 22, 2009

    Great work – really useful source!

    Reply
  18. gouri
    November 29, 2009

    Excellent List. I will use some of them in my current project. Thanks

    Reply
  19. Basti
    February 6, 2010

    Great list :)

    Reply
  20. WebpageLottery
    April 3, 2010

    Please post more these kind of jQuery effect posts in the future. Thank you.

    Reply
  21. Samson Delila
    June 10, 2010

    Wow! Most wanted amazing jquery tuts!
    Its very nice you write all of them on one post.
    Thanks for share this…

    Reply

Leave a Reply