jQuery Megamenu position alignment

Question

http://www.osep2.uga.edu/EE/Home

How can I make the megamenu drop downs align with the left side of the container? At the moment they align left with the entire page. If I change the position to relative, the drop downs no longer appear.

Thanks!

Answer 1

So it seems like jkmegamenu automatically forces your boxes outside your container, even though you place them inside in your code. Although I wouldn't recommend using something like this, you can just place a fix at the bottom of your code with some jQuery.

// Gets your left offset of the container div
var fromLeft = $('#container').offset().left;

// move all menus to this new offset
$('#megamenu1').css('left', fromLeft);
$('#megamenu2').css('left', fromLeft);
$('#megamenu3').css('left', fromLeft);
$('#megamenu4').css('left', fromLeft);
$('#megamenu5').css('left', fromLeft);

Keep in mind, this is a simple fix. It will only work for the browsers current size. If it changes, the offset's stay the same and you would have to redo the numbers. For future reference, I would do something a little more conventional like this one