Flyout child menu extends off-screen

Flyout child menu extends off-screen

I have a menu that pops off a toolbar button. One of the menu items has child items, resulting in a flyout. It's pretty long and extends off the screen (causes the scroll length to increase). I have position() on the parent menu object, but it's having no effect on the flyout. What I want is for the top of the flyout to be above the parent menu item such that the bottom of the flyout goes to the bottom of the page but not below.

My HTML is identical to the sample on the Menu Widget page. Here is my setup:
  2. $(utilitiesButton).button().on("click", function () {
  3.     $(utilitiesMenu).show().position({
  4.         my: "left top",
  5.         at: "left bottom",
  6.         of: this,
  7.         collision: "flip fit",
  8.         within: "#validatorContainer"
  9.     });

  11.     return false;
  12. });
Many thanks for any assistance.