Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Getting the absolute position of an a element

    I have a valid XHTML 1 transitional page with the folowing elements:
    <div><div><a href="">text</a></div></div>
    I have some CSS associated with the elements,but I didn't set the position property nor the top/left properties for the elements.How can I get the absolute position (i.e. the distance from html element to the a element) of the a element (in a W3C standard compliant way,so that it will work in Mozilla and Konqueror)?
    I have a absolute positioned div which I want to move to near the link,but I can't get it's absolute position.
    Btw.I tried computed style,but it returns NaN (not a number) because the computed value of left is "auto" in Mozilla.Does anyone know how I can do this?

    Thank you in advance.

  • #2
    Senior Coder
    Join Date
    Aug 2002
    Posts
    3,467
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    function getAbsPos( oId, tl ) {
    	var o = (typeof oId = 'String') ? document.getElementById( oId ) : oId;
    	var val = 0;
    	while ( o.parentNode.nodeName != "body") {
    		val += (tl == 'top') ? parseInt( o.style.offsetTop ) : parseInt( o.style.offsetLeft );
    		o = o.parentNode;
    		}
    	return top;
    	}
    Example uses
    Code:
    // Assuming the object's id is 'myDiv'
    
    var top = getAbsPos( 'myDiv', 'top' );
    var left = getAbsPos( 'myDiv', 'left' );
    
    // or if you don't know the ID or have an existing object reference
    
    var d = document.createElement( "DIV" );
    var div = document.appendChild( d );
    var top = getAbsPos( div, 'top' );
    var left = getAbsTop( div, 'left' );
    My Site | fValidate | My Brainbench | MSDN | Gecko | xBrowser DOM | PHP | Ars | PVP
    “Minds are like parachutes. They don't work unless they are open”
    “Maturity is simply knowing when to not be immature”

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That code does not work,top and left are "undefined".I am passing a valid reference to the element (I checked it).
    There are some mistakes in the code,like:why does it return top?It should return val.And it should be == instead of =.Fixing these errors make makes left and top "NaN" (not a number).Are you sure that the code is made for Mozilla/Konqueror,in a XHTML page?
    Last edited by Bosko; 12-21-2002 at 01:20 PM.

  • #4
    Senior Coder
    Join Date
    Aug 2002
    Posts
    3,467
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Doh, that's what I get for coding quick and not testing it. I'll fix it up and re-post
    My Site | fValidate | My Brainbench | MSDN | Gecko | xBrowser DOM | PHP | Ars | PVP
    “Minds are like parachutes. They don't work unless they are open”
    “Maturity is simply knowing when to not be immature”

  • #5
    Regular Coder
    Join Date
    Jun 2002
    Location
    The Netherlands
    Posts
    217
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay,thank you.

  • #6
    Senior Coder
    Join Date
    Aug 2002
    Posts
    3,467
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here ya go.
    Code:
    function getAbsPos( oId, tl ) {
    	var o = ( typeof oId == 'String' ) ? document.getElementById( oId ) : oId;
    	var val = 0;
    	while ( o.nodeName != "BODY" ) {
    		val += parseInt( ( tl == 'top' ) ? o.offsetTop : o.offsetLeft );
    		o = o.parentNode;
    		}
    	return val;
    	}
    Last edited by beetle; 12-21-2002 at 09:53 PM.
    My Site | fValidate | My Brainbench | MSDN | Gecko | xBrowser DOM | PHP | Ars | PVP
    “Minds are like parachutes. They don't work unless they are open”
    “Maturity is simply knowing when to not be immature”

  • #7
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •