Skip to content

Instantly share code, notes, and snippets.

@Morgul
Created July 20, 2013 01:04
Show Gist options
  • Save Morgul/6043382 to your computer and use it in GitHub Desktop.
Save Morgul/6043382 to your computer and use it in GitHub Desktop.
Potential fix for Bootstrap's poor menu detection of screen edges.
$(".dropdown-toggle").click(function(e) {
var menu = $(this).next('.dropdown-menu'),
mousex = e.pageX + 20, //Get X coodrinates
mousey = e.pageY + 20, //Get Y coordinates
menuWidth = menu.width(), //Find width of tooltip
menuHeight = menu.height(), //Find height of tooltip
menuVisX = $(window).width() - (mousex + menuWidth), //Distance of element from the right edge of viewport
menuVisY = $(window).height() - (mousey + menuHeight); //Distance of element from the bottom of viewport
if (menuVisX < 20) { //If tooltip exceeds the X coordinate of viewport
menu.css({'left': '-89px'});
} if (menuVisY < 20) { //If tooltip exceeds the Y coordinate of viewport
menu.css({
'top': 'auto',
'bottom': '100%',
});
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment