mod for fixing dropdowns when in centered div

OK, since the dropdown system in the new forum was, in my mind, poorly implemented and still not fixed.  Here's an easy mod that only requires a little bit of change to the forum's default_javascript_v9.js file.  This way it won't be a hassle to continue to upgrade to newer forum versions.  Replace the showDropDown function with the below.  You may need to add additional Javascript to the portion labeled //offsets for other dropdowns that aren't aligning correctly.

function showDropDown(parentEle, dropDownEle, dropDownWidth, offSetRight){

    parentElement = document.getElementById(parentEle);
    dropDownElement = document.getElementById(dropDownEle)

    //position
    //dropDownElement.style.left = (getOffsetLeft(parentElement) - offSetRight) + 'px';
    //dropDownElement.style.top = (getOffsetTop(parentElement) + parentElement.offsetHeight + 3) + 'px';
   
    //offsets
    offsetleft=0;
    if (Left(parentEle,11)=='postOptions'){
        offsetleft=150;
    }
    if (Left(parentEle,15)=='SearchTopicLink'){
        offsetleft=150;
    }
    if (Left(parentEle,8)=='modTools'){
        offsetleft=150;
    }
    if (Left(parentEle,12)=='topicOptions'){
        offsetleft=150;
    }   

    dropDownElement.style.left = getY(parentEle, 'left')+offsetleft+'px';
    //dropDownElement.style.top = (getY(parentEle, 'top')+40)+'px';

    dropDownElement.style.top = (getOffsetTop(parentElement) + parentElement.offsetHeight -100) + 'px';

    //width
    dropDownElement.style.width = dropDownWidth + 'px';

    //display
    hideDropDown();
    dropDownElement.style.visibility = 'visible';


    //Event Listener to hide drop down
    if(document.addEventListener){ // Mozilla, Netscape, Firefox
        document.addEventListener('mouseup', hideDropDown, false);
    } else { // IE
        document.onmouseup = hideDropDown;
    }
}

function Left(str, n){
    if (n <= 0)
        return "";
    else if (n > String(str).length)
        return str;
    else
        return String(str).substring(0,n);
}
function Right(str, n){
    if (n <= 0)
       return "";
    else if (n > String(str).length)
       return str;
    else {
       var iLen = String(str).length;
       return String(str).substring(iLen, iLen - n);
    }
}

function getY( oElement, opos )
{
var iReturnValue = 0;
elementid=document.getElementById(oElement)
while( elementid != null ){
    if (opos=="top"){
        iReturnValue += elementid.offsetTop;
    }else{
        iReturnValue += elementid.offsetLeft;
    }
//elementid = elementid.offsetParent;
elementid=null;
}
//alert(opos+" - "+iReturnValue);
return iReturnValue;
}


Edited by odang - 22 September 2007 at 10:35pm

if you have your forum centered withing Div tags verses tables, the the dropdowns don't appear in the correct spots.  This is the fix for it.  If your dropdowns (calendar, search, topic options, post options...) are appearing off point then you will potentially want to use this.