Forums Archive Index > SmartMenus 5 > Relative positioning not 100% correct

Author: Faan

Date: 27 Dec 2004 2:38 pm

Hello,

I am redesigning my website and found this marvelous menu, I use relative positioning but encountered some problems.

URL: --> http://www.31tigersqn.be/nieuw

When looking at it in Internet Explorer and then in Firefox, I noticed the submenus appear on a slightly different location. I would really like them to stay exactly under the leftborder of the main button. This also happens when I check it in different browsers...

E.g. --> http://www.airliners.net's menu stays at the exact location throughout all broswers and resolutions. How do they do it???


Can some one help me?

Thanks in advance...

Faan

Author: smartmenus

Date: 27 Dec 2004 8:30 pm

Hi,

I just tested your site and noticed that the function for relative positioning returns correct values (e.g. it reports the position of the image correctly).

You can take a look at the following example- --> http://www.smartmenus.org/down/tiger_example.zip - note how the menu for the ACTUAL link pops at the correct position in IE, Firefox and Opera...

This means that the problem is coming from the design- your page header is obviously not displayed the same way in all browsers.

I would suggest you to at least set the top position of the menus to also be relative to the image (let's say T:'s_getStart("y")+10' for all first-level menus). This way at least the difference in the Y position of the menus will be reduced. Otherwise, the best option would probably be to rework the page header and make it render exactly the same way in all browsers. :? This is the case with the --> http://www.airliners.net site.

Thanks!

Author: Faan

Date: 28 Dec 2004 4:49 am

Ok, I'll try this as soon as I have some spare time (studying for university examsn at the moment :? ) Thanks for the reply.

Author: Faan

Date: 29 Dec 2004 10:19 am

Ok, I applied your script that I dowloaded, but still not perfect in IE, does place the submenu's perfect in FF. Is it the header positioning that causes this? If yes, how can I get this correctly? Another 'problem' I noticed in IE: when the window is not maximized and I go over a button so the submenu appears, my content table (the yellow square under the big yellow title bar) appears aligned left shortly and then goes back centered.

Author: smartmenus

Date: 29 Dec 2004 12:07 pm

Faan wrote:
Ok, I applied your script that I dowloaded, but still not perfect in IE, does place the submenu's perfect in FF. Is it the header positioning that causes this? If yes, how can I get this correctly?
Perhaps you didn't understand me completely the previous time. The problem is coming from the design of your toolbar. Obviously the table with your toolbar is not rendered the same way in IE, Opera and FF. Please take a closer look at the following screenshots and note the differences in the positions of the toolbar links:





So it's up to you to rework your toolbar if you are not happy with the current result. You could use images, for instance, for perfect results although I personally think it's better to leave it with text links as it is at the moment :?

Faan wrote:
Another 'problem' I noticed in IE: when the window is not maximized and I go over a button so the submenu appears, my content table (the yellow square under the big yellow title bar) appears aligned left shortly and then goes back centered.
This seems like one of the many weird rendering bugs IE has. I don't think we can do something about it.

Author: Faan

Date: 29 Dec 2004 1:38 pm

Thanks for the reply, I'll try to figure out how to make the table the same in IE as in FF and Opera.

Author: Faan

Date: 29 Dec 2004 2:10 pm

Ok, I'm going mad, mentally ill and crazy at the same time by fouling around in this header. It just won't work, and I think its because the links are being centered inside their cel, and that causes another position in IE. But when I align them left the whole menu is bad looking.

I was thinking of something: could it be made I place an image at each link (e.g. getStart1, getStart2 etc.) and then put the positioning in s_arrays.js somehting like s_getStart1("x"), s_getStart2("x") etc.?
Or am I hallucinating?

Author: smartmenus

Date: 30 Dec 2004 5:13 am

Faan wrote:
I was thinking of something: could it be made I place an image at each link (e.g. getStart1, getStart2 etc.) and then put the positioning in s_arrays.js somehting like s_getStart1("x"), s_getStart2("x") etc.?
Or am I hallucinating?Yep, something like this won't be a problem. Just replace your positioning function with the one in the following file:

--> http://www.smartmenus.org/down/rel_pos_function2.txt

You can then use the new function like this:

s_getStart("x","imageName")

So you will be able to position each menu (if you like) relative to a different image by changing the "imageName" argument.

And please take it easy. We wouldn't like any fatal consequences.. :D

Author: Faan

Date: 30 Dec 2004 6:22 am

THANK YOU!! It works great!! Now I only have one question: regarding the last link (about): how do I get the submenu to align to the right border of my layout? Now it's sticking out of the contents table.

Author: smartmenus

Date: 30 Dec 2004 6:39 am

Well, set a different value for left- something like 's_getStart("x","about")-100'... I don't know- just tweak it a bit. :wink:

Author: Faan

Date: 30 Dec 2004 6:46 am

Ok, it works great! Thanks again for the fast and good help!!