, , , ,

Recently I’ve used jQuery Mega Menu on a site. The default style for this menu it appear from left corner to below the link/button when mouse is over. But I wanted it appear above the link/button when mouse is over, here is the code we need to change  on line 76 of jkmegamenu.js file

//existing line
// megamenu.offsety= megamenu.$anchorobj.offset().top
//Change to
megamenu.offsety= megamenu.$anchorobj.offset().top - (megamenu.$menuobj.outerHeight() + megamenu.$anchorobj.outerHeight())

Just subtract top position with total of menu object height and anchor so the bottom line of new box will appear just above the link/button.

But I got some problem when I was adding this code to a page where already have jQuery UI  items, both jquery ui tabs/accordion/dialog…etc. and mega menu wasn’t work. After check the mega menu js file I got the solution, we just need to comemnted out or remove the following line at the begianing of file


Done, everything working with me properly hope it will work with you as well 🙂