View Full Version : Need to force drop down menu to only drop down.....not up

08-12-2013, 03:04 PM
1) Split Menu Buttons v1.2

2) http://www.dynamicdrive.com/dynamicindex1/splitmenubuttons.htm

3) I currenty am trying to use this drop menu in a frame and because of that I think it is causing the menu to drop up. Is there a way to force the menu to only drop down and make the z-index open it up over everything?

thanks in advance

08-12-2013, 04:05 PM
Using a text only editor like NotePad, in the splitmenubuttons.js script, find this function:

function positionmenu(s, level, $toggler, $dropmenu){
if (level == "toplevel"){
var docrightedge = $(document).scrollLeft() + $(window).width() - 40
var docbottomedge = $(document).scrollTop()+$(window).height()-40
this.docrightedge = docrightedge // cache this value
this.docbottomedge = docbottomedge
var $offset = $toggler.data('mainanchor').offset()
var togglerWidth = (s.split)? $toggler.data('mainanchor').width() + $toggler.width() : $toggler.width()
var togglerHeight = $toggler.height()
var dropmenuWidth = $dropmenu.outerWidth()
var dropmenuHeight = $dropmenu.outerHeight()
var leftpos = (($offset.left + dropmenuWidth) > docrightedge)? $offset.left - (dropmenuWidth - togglerWidth) : $offset.left
var toppos = (($offset.top + dropmenuHeight) > docbottomedge)? $offset.top - (dropmenuHeight + togglerHeight) : $offset.top
return {left: leftpos, top: toppos}
var $offset = $toggler.offset()
var submenuWidth = $dropmenu.outerWidth()
var submenuHeight = $dropmenu.outerHeight()
var leftpos = ($offset.left + (submenuWidth*2) > this.docrightedge)? -submenuWidth : submenuWidth
var toppos = ($offset.top + (submenuHeight) > this.docbottomedge)? -submenuHeight + $toggler.height() : 0
return {left: leftpos, top: toppos}

Change the highlighted line to:

var docbottomedge = 99999999

Save and use that version of the script.

The browser cache may need to be cleared and/or the page refreshed to see changes.

I'm not sure what you mean about the z-index. If you mean that you want the menu to drop over the iframe border, z-index will not do that. There is a fellow on here who has code for that sort of thing though, hopefully he will reply.

But my approach would be, instead of an iframe, I would use either a server side include (if available) or AJAX.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

08-12-2013, 05:08 PM
That fellow is me.
Please send me a link to your site or the source of your page so that I can see what we can do about the matter.
It's tricky, but possible.
Are you talking about the frame of a frameset, or about an iframe?
Note that the options of regular drop downs (select boxes) drop over the (i)frame border just by themselves.

08-12-2013, 05:25 PM
I forgot to give you a site where regular dropdowns are used to accomplish what you want. Here's the url (http://mesdomaines.nu/extincthumanspeciesandhomosapiens).
If you think the site looks good enough, I would advise you to use standard drop downs (or a server side include, of course).