Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Object returning the style.left attribute

Status
Not open for further replies.

Ebow

Programmer
Oct 11, 2002
24
IE
Hey,

I am working on a drop down menu in JavaScript and all is going well, except for aligning the menu underneath the object I want it to appear under. The problem is that I have set the 'left' attribute as a set number (say 200 pixels) which is fine for the resolution I am working in.

However, if I resize the window, then 200 pixels places the menu beyond the image I want it to be placed under. I am basically wondering if it is possible for an element to return its style.left attribute so that I can realign the menu on resize?

Something like:
---------------
document.getElementById('Menu1').style.left = document.getElementById('Image1').style.left;

I have tried the above but it doesn't actually work. I have set:
---------------
document.getElementById('Image1').style.left = 200;
document.getElementById('Menu1').style.left = document.getElementById('Image1').style.left;

which works but I want it to dynamically get the style.left value so the menu will move around the screen with the image when resized.

Hope I have been clear enough for you, and I hope you can help me too :)

Thanks for you time,

Peter
 
You can try to place that code into a function that will be called on body onResize event.

Also, I recommend you to visit this site: There are excellent examples of cross-browser menus - fixed and floating.
 
Hey again,

Thanks for the help so far. I have tried using the Object.offset attribute and I have set the poition of the menu I want to drop down underneath the object as follows:

document.getElementById('dropDownMenu').style.left = document.getElementById('Image').offsetLeft;

But the menu just appears at the left of the screen as if its' left attribute is set to 0. I get a javascript error (Object doesn't support this action) if I try to set:

document.getElementById('dropDownMenu').offsetLeft = document.getElementById('Image').offsetLeft;

I have set the images id tag in the link surrounding the image, I don't know if that will affect what the offsetLeft attribute is set to.

Any more ideas would be greatly appreciated,

Thanks again,

Peter
 
Hey,

Just a little update, I have set a little alert window onMouseOver = "alert(this.style.offsetLeft);" and it is consistently returning zero. Does it set its' offset relative to another object?

I guess this is really the root of the problem, so if anyone can help me with this I will really appreciate it :)

Thanks again,

Peter
 
Whoops (hehe can you edit posts?) The alert window actually reads alert(this.offsetLeft); not style.offsetLeft.

Sorry for the thread spam :(

Peter
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top