Which Navigational menu is this?

Get Started
1

Hello

I am trying to find out the menu being used here

http://morganranchinc.com/t/categories/ribeyes/

Is it slide out jquery vertical menu ?

Can i find out a tutorial on this particular navigational menu ?

2

Let’s find out. The id value for the navigation menu is “main_nav”

The page source doesn’t show anything relating to that, but the following script does:

http://morganranchinc.com/javascripts/morgan-ranch.js


jQuery(function()
{
  jQuery("#main_nav li ul").hide();

  jQuery("#main_nav > li").hover(
    function(){
      var x = jQuery(this).addClass("active").find("ul").show();
      if( $(this).attr("id") == "nav_8" )
      {
        var y = x.parent();
        x.css("right",($(window).width()-y.position().left-y.width())+"px");
      }
    },
    function(){jQuery(this).removeClass("active").find("ul").hide();});

});

I typically turn to Stu Nicholls when it comes to menu designs and naming schemes for them.

“Dropdown with flyout menus” is a good description for that type of menu.
Stu has an example on his site that uses pure CSS to achieve the same effect, which might be a more portable solution for you.

http://www.cssmenus.co.uk/dropdown.html#url

The scripting code looks to be a custom job, so I doubt it, no.

However, if you do a search you’ll find results such as:
25 jQuery Drop Down Menu Scripts

3

Awesome answer, Paul. Not only did you provide an excellent answer, you walked the poster (and me!) through the process.

I hereby crown you King for a Day. Wear it with pride, sirrah. :slight_smile: (Okay, I’m in one of those moods.)

4

I’m glad that it worked out so well.

:king:

I could get used to this.

{calls to random lacky} Fetch me a cromulent widget to embiggen my mood.