Web Wiz Forums - showDropDown

Print Page | Close Window

showDropDown

Printed From: Web Wiz Forums
Category: Web Wiz Web App Support Forums
Forum Name: Web Wiz Forums
Forum Description: Support forum for Web Wiz Forums application.
URL: https://forums.webwiz.net/forum_posts.asp?TID=23897
Printed Date: 06 April 2026 at 10:58pm
Software Version: Web Wiz Forums 12.08 - https://www.webwizforums.com

Topic: showDropDown

Posted By: Hydrogen
Subject: showDropDown
Date Posted: 23 July 2007 at 6:16pm

I'm having some trouble with this both in IE and Firefox.

Whenever the drop down menu is called the pop-up is always a long way to the right, and futher down than it should be...

My entire forum is contained in a container DIV which is positioned relatively. But looking at the showDropDown script, it should work I thought.

(getOffsetLeft(parentElement) and (getOffsetLeft(parentElement) both return the correct position of the link that calls the script, yet the pop-ups are placed in odd places.

any ideas?

-------------
Signature?

Replies:

Posted By: Hydrogen
Date Posted: 26 July 2007 at 6:16pm

Just an update for anyone that may have a similar problem...

I solved this by adding some lines to getOffsetLeft(elm) and getOffsetTop(elm). The problem was that my site is surrounded by DIVs, and I needed the position from the element to the DIV, not from the elemnet to the BODY tag.

I included some new variables in the loop which adds up the distance, they are to store the two previous results given, then to pass the oldest result back to 'showDropDown'.

a messy way of doing it... but I couldn't think of a way to stop:
while(mOffsetParent){

two loops before it became a null value.

-------------
Signature?

Posted By: odang
Date Posted: 02 August 2007 at 12:34pm

could you please either post or PM the code to correctly align the dropdowns? I have the exact same issue.

Posted By: Hydrogen
Date Posted: 03 August 2007 at 12:02pm

Well it turns out it never worked in IE. I don't have the code anymore but it was something like...


function getOffsetLeft(elm){
    var mOffsetLeft = elm.offsetLeft;
    var mOffsetParent = elm.offsetParent;
    var SecondtoLast;
    while(mOffsetParent){
         SecondtoLast = mOffsetLeft;
        mOffsetLeft += mOffsetParent.offsetLeft ;
        mOffsetParent = mOffsetParent.offsetParent;
    }
    return SecondtoLast;
}

anyone any ideas why this wouldn't work in IE? It DOES return the correct value... BUT IE still positions it in relation to the window... not the DIV. (the div is set up correctly, everything I position : absolute;... end up in the top left corner of it, apart from this dropdown. GRRR Wacko

-------------
Signature?

Posted By: Mikey
Date Posted: 05 August 2007 at 9:00pm

I'm looking into this as well as i always place my forum in a seperate DIV so it slots in with my website.

Strangley enuff the styling is also all wrong on the links with drop down menus...

For example... http://skatenstone.co.uk/testforum/default.asp - http://skatenstone.co.uk/testforum/default.asp

-------------
Handyman man?

Posted By: Hydrogen
Date Posted: 05 August 2007 at 11:03pm

I'm still no further forward on it myself, but the site is coming together and it needs sorting.

so, I have two options....

place a DIV around every single place that I need a popup and position the popup absolutley...

or.. carry on thinking about it...

I'm no cross browser tag genius or anything but, is there nothing we could do using LayerX and LayerY properties?

-------------
Signature?

Posted By: Hydrogen
Date Posted: 09 August 2007 at 7:15pm

UPDATE!

I've devised a better solution!

Simply work out the distance of your container DIV from the left of the body.

Here is the edit I made to 'function ShowDropDown'... this works for me, where my container DIV is called 'containername'.


    var mOffsetContainer = document.getElementById('containername')
    mOffsetC = mOffsetContainer.offsetLeft;
    dropDownElement.style.left = (getOffsetLeft(parentElement) - offSetRight - mOffsetC) + 'px';
    dropDownElement.style.top = (getOffsetTop(parentElement) + parentElement.offsetHeight - 3) + 'px';

-------------
Signature?

Posted By: Mikey
Date Posted: 10 August 2007 at 12:35am

Nice, i'll give this a go later and report back Thumbs%20Up

-------------
Handyman man?

Posted By: Hydrogen
Date Posted: 14 August 2007 at 12:11pm

UPDATE REGARDING RTE.

The RTE 'Font Size', 'Font Type' buttons and colour pallette drop downs are also offset if you use a container DIV.

RTE_javascript.asp

Line 226
    var mOffsetContainer = document.getElementById('container')
    mOffsetC = mOffsetContainer.offsetLeft;
        document.getElementById(iframeWin).style.left = getOffsetLeft(buttonElement)- mOffsetC + 'px';
        document.getElementById(iframeWin).style.top = (getOffsetTop(buttonElement) + buttonElement.offsetHeight) + 'px';

The bold bits are what I inserted 'container' is the name of the container DIV.

-------------
Signature?