10 jQuery Floating Menu and Message Plugins

Sam Deering

These are some awesome jQuery Floating Menu plugins in today’s post will help you to add a floating, sticky menu containing important links to your website. The “floating” effect! You will notice that the menu bar at the top starts floating over the rest of the page once you scroll past it. Enjoy!

Related Posts:

1. Portamento.js

A jQuery plugin that makes it simple to add sliding (aka “floating”) panel functionality to your web page. Works fine with floated and absolutely-positioned layouts, in all modern browsers and some not-so-modern ones too.



2. jQuery floating menu

A simple navigation menu that “follows” page scrolling and expands on mouse over, made with CSS and jQuery.

jQuery floating menu


3. Create a Floating Menu with jQuery

Here is the code you can use to create a floating jQuery menu that stays where you absolutely position it on the screen. Make sure you have jQuery loaded on whatever page you use this.

Floating Menu with jQuery


4. Absolute Floating Menu as jQuery plugin

Is also a jQuery plugin right out of the box (in addition to standalone mode). When the script code is loaded, if jQuery was loaded before that (even in when noConflict() is used), Absolute floating menu will register itself as jQuery plugin.

Absolute Floating Menu

Source + Demo

5. jQuery Floating Message Plugin

This plugin will basically display the messages easily. Dual licensed under the MIT or GPL Version 2 licenses.

jQuery Floating Message Plugin

Source + Demo

6. Creating a Floating HTML Menu Using jQuery and CSS

For all of us who deal with long web pages and need to scroll to the top for the menu, here’s a nice alternative: floating menus that move as you scroll a page. This is done using HTML, CSS and jQuery, and it’s fully W3C-compliant.

Floating HTML Menu


7. Fixed Floating Elements

Learn how to replicate the fixed floating sidebars or elements with very little jQuery.

Fixed Floating Elements

Source + Demo

8. jqFloat.js

A jQuery plugin that able to make any HTML objects appear to be floating on your web page.


Source + Demo

9. Floating HTML5 Menu

This menu works perfectly well with Firefox, Opera, Chrome and Safari. The dropdown also works on non-CSS3 compatible browsers such as IE7+, but the rounded corners and shadow will not be rendered.

Floating HTML5 Menu


10. Horizontal Floating Menu Demo Using jQuery

What you just experienced is nothing but the Horizontal Water Menu packaged as a plugin for the amazing jQuery JavaScript library.

Horizontal Floating Menu

Source + Demo