如果没有足够的空间,如何让superfish菜单向后打开?

hun*_*eox 5 jquery superfish drop-down-menu

如何让superfish菜单向后打开?我在fanpage页面上将我的facebook应用程序嵌入了一个supperfish菜单,没有足够的空间让菜单完全展开,因为它在iframe中运行.如何通过使用superfis或任何其他jquery菜单插件解决此问题也很好.

谢谢.

目前的情况 目前的情况

预期的结果 预期的结果

@Updated:这是一个用户定义的菜单,它没有菜单级别的限制.

sad*_*daf 5

我知道这个问题很老,但仅供参考,这就是我解决上述问题的方法

var windowWidth;
$(document).ready(function (){
        windowWidth= $(window).width();
        $( window ).resize(function() {
            windowWidth = $(window).width();
        });

        $('.top-nav').superfish({
            onBeforeShow : function (){                 
                if(!this.is('.top-nav>li>ul')){
                    var subMenuWidth = $(this).width();
                    var parentLi = $(this).parent();                    
                    var parentWidth = parentLi.width();
                    var subMenuRight = parentLi.offset().left + parentWidth + subMenuWidth;
                    if(subMenuRight > windowWidth){
                        $(this).css({'left': 'auto', 'right': parentWidth+'px'});
                    } else {
                        $(this).css({'left': '', 'right': ''});
                    }
                }
            }
        });
 });
Run Code Online (Sandbox Code Playgroud)


dop*_*ois 1

ul ul ul ul ul { right: 100%; }
Run Code Online (Sandbox Code Playgroud)

这样,4. 子菜单之后的所有子导航都将定位到左侧。

下一步是在几次 UL 之后重置此属性,如下所示:

ul ul ul ul ul ul ul ul { right: auto; left: 100%; }
Run Code Online (Sandbox Code Playgroud)

尝试玩一下它。

我从未开发过如此多的嵌套导航,但此代码片段在其他情况下可能很有用。

希望这可以帮助。