Javascript下拉菜单小部件

我有一个菜单，包含一个Web CMS中的

。 我希望多个菜单项具有显示在下拉列表中的子项。这些子项也是
s
使用几行CSS和Javascript基本上很容易做到这一点，但我正在寻找一个现成的Javascript解决方案，帮助我处理以下问题：
• 处理屏幕边缘情况：如果下拉菜单中的任何部分位于当前视口之外，请将其放置在视口内
这是一个从零开始编写代码的婊子
“很高兴拥有”应该是：
• 在下拉按钮下方居中定位

• 向主体添加onclick事件，以便在下拉菜单外单击将关闭它；随后清除onclick事件

但如果有必要，我可以自己做
一个漂亮、小巧、不引人注目的小部件，可以神奇地转换我的

---

如果解决方案基于框架，则必须是原型，因为我在CMS中使用的就是原型。
您可以获得UL的偏移量，并检查这些偏移量是否在视口的特定距离内

// Pseudo code
var ul = document.getElementById("menu");
if(ul.offset.x + ul.width > viewport.width) {
    ul.offset.x = viewport.width - ul.width;
}

---

还可以单击下拉按钮的确切位置，然后应用基本数学将菜单放置在其下方。
是的，就是这样。然而，我从以前的经验中知道，正确地实现这一点（考虑到可滚动容器、绝对/相对位置等等），然后使其在所有浏览器中都能工作，往往会占用大量时间。我很想绕开这一点：）在这种情况下，图书馆真的会有所帮助，不幸的是，我不能帮助你，因为我倾向于使用我自己的图书馆。