Question

我使用下面的js来显示我网站上的菜单，它的工作正常，但是当浏览器窗口很小时，下拉列表显示为向上？我如何制作这样的JS，无论窗口大小如何，下拉菜单都向下显示？

我试图在代码结尾处使y = 0，但没有运气。

var flexdropdownmenu = {
    arrowpath: '../Uploadedfiles/System/Scripts/flexdropdown/arrow.gif', //full URL or path to arrow image
    animspeed: 200, //reveal animation speed (in milliseconds)
    showhidedelay: [150, 150], //delay before menu appears and disappears when mouse rolls over it, in milliseconds

    //***** NO NEED TO EDIT BEYOND HERE
    startzindex: 1000,
    ismobile: navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)/i) != null, //boolean check for popular mobile browsers
    builtflexmenuids: [], //ids of flex menus already built (to prevent repeated building of same flex menu)

    positionul: function ($, $ul, e, $anchor) {
        var istoplevel = $ul.hasClass('jqflexmenu') //Bool indicating whether $ul is top level flex menu DIV
        var docrightedge = $(document).scrollLeft() + $(window).width() - 40 //40 is to account for shadows in FF
        var docbottomedge = $(document).scrollTop() + $(window).height() - 40
        if (istoplevel) { //if main flex menu DIV
            var offsets = $anchor.offset()
            var anchorsetting = $anchor.data('setting')
            var x = offsets.left + anchorsetting.useroffsets[0] + (anchorsetting.dir == "h" ? $anchor.outerWidth() : 0) //x pos of main flex menu UL
            var y = offsets.top + anchorsetting.useroffsets[1] + (anchorsetting.dir == "h" ? 0 : $anchor.outerHeight())
            x = (x + $ul.data('dimensions').w > docrightedge) ? x - (anchorsetting.useroffsets[0] * 2) - $ul.data('dimensions').w + $anchor.outerWidth() + (anchorsetting.dir == "h" ? -($anchor.outerWidth() * 2) : 0) : x //if not enough horizontal room to the ridge of the cursor
            y = (y + $ul.data('dimensions').h > docbottomedge) ? y - (anchorsetting.useroffsets[1] * 2) - $ul.data('dimensions').h - $anchor.outerHeight() + (anchorsetting.dir == "h" ? ($anchor.outerHeight() * 2) : 0) : y
            y = y - 5;
        }
        else { //if sub level flex menu UL
            var $parentli = $ul.data('$parentliref')
            var parentlioffset = $parentli.offset()
            var x = $ul.data('dimensions').parentliw //x pos of sub UL
            var y = 0
            x = (parentlioffset.left + x + $ul.data('dimensions').w > docrightedge) ? x - $ul.data('dimensions').parentliw - $ul.data('dimensions').w : x //if not enough horizontal room to the ridge parent LI
            y = (parentlioffset.top + $ul.data('dimensions').h > docbottomedge) ? y - $ul.data('dimensions').h + $ul.data('dimensions').parentlih : y
            //To show the submenu downwards irrespective of the browser resolution or size
            y = 0;
        }

        $ul.css({ left: x, top: y })
    }

Answer 1

    if (istoplevel){ //if main flex menu DIV
        var offsets=$anchor.offset()
        var anchorsetting=$anchor.data('setting')
        var x=offsets.left+anchorsetting.useroffsets[0]+(anchorsetting.dir=="h"? $anchor.outerWidth() : 0) //x pos of main flex menu UL
        var y=offsets.top+anchorsetting.useroffsets[1]+(anchorsetting.dir=="h"? 0 : $anchor.outerHeight())
        x=(x+$ul.data('dimensions').w > docrightedge)? x-(anchorsetting.useroffsets[0]*2)-$ul.data('dimensions').w+$anchor.outerWidth()+(anchorsetting.dir=="h"? -($anchor.outerWidth()*2) : 0) : x //if not enough horizontal room to the ridge of the cursor
        //y=(y+$ul.data('dimensions').h > docbottomedge)? y-(anchorsetting.useroffsets[1]*2)-$ul.data('dimensions').h-$anchor.outerHeight()+(anchorsetting.dir=="h"? ($anchor.outerHeight()*2) : 0) : y
    }
    else{ //if sub level flex menu UL
        var $parentli=$ul.data('$parentliref')
        var parentlioffset=$parentli.offset()
        var x=$ul.data('dimensions').parentliw //x pos of sub UL
        var y=0
        x=(parentlioffset.left+x+$ul.data('dimensions').w > docrightedge)? x-$ul.data('dimensions').parentliw-$ul.data('dimensions').w : x //if not enough horizontal room to the ridge parent LI
        //y=(parentlioffset.top+$ul.data('dimensions').h > docbottomedge)? y-$ul.data('dimensions').h+$ul.data('dimensions').parentlih : y
    }

当浏览器窗口大小较小时，菜单会向上显示

1 个答案: