如何根据可用空间自动打开左下侧或右侧下拉菜单子菜单

时间:2014-09-25 11:54:43

标签: javascript jquery html css twitter-bootstrap

子菜单显示在右侧,当左侧有足够的空间弹出时,该子菜单不在屏幕上。如何通过首先检查菜单应显示的位置来实现允许子菜单显示在左侧而不是右侧的功能

以下图片展示了我的意思。 (这是典型的窗口右键单击桌面,例如)

Submenu on left when there is no room on right

在此图片中,子菜单在左侧打开,知道右侧没有空间。

Submenu on right When there is room on right

在此图片中,子菜单在左侧打开,知道左侧有空间。

我想实现这样的功能。

那么,我怎么能做到这一点? 我试过调整我的CSS 用这个

.sf-menu > li:last-child > ul ul {
  left: auto; // reset the default positioning
  right: 100%; // this makes the submenu fly out to the left
}

Supposition Plugin written by Joel Birch

这解决了它。但我不能在我的作品中使用这个插件。

还有其他办法吗?

0 个答案:

没有答案