www.webdeveloper.com
Results 1 to 5 of 5

Thread: Getting the pixel position of an element

  1. #1
    Join Date
    Sep 2004
    Posts
    3

    Getting the pixel position of an element

    I have a nav bar made out of a table based on % of the screen size. When I put my mouse over the link a sub-menu appears below it. My problem is not everyone uses the same screen resolution and my menu doesnt appear where it is supposed to if the screen size has been changed. I was wondering if there is a way to get the starting pixel of an element, my first link, that way I can calculate the correct position from the left of the screen. I appreciate it.

  2. #2
    Join Date
    May 2004
    Location
    Manhattan NY
    Posts
    6,028
    Use % to position elements to begin with, then. Let the browser calculate it.

  3. #3
    Join Date
    Sep 2004
    Posts
    3
    Originally posted by DUNSEL
    Use % to position elements to begin with, then. Let the browser calculate it.
    Thankx, but I already tried that and it doesnt work. Even on the developing screen resolution it's still a pixel or 2 off and doesn't look right. You would think you could do something like

    var x = parseInt(document.getElementById("nav1").style.pixelBottom;

    If there is a way to make this work it sure would help. That just returns 0 which isn't what I want.

  4. #4
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654

  5. #5
    Join Date
    Sep 2004
    Posts
    3

    Talking solved the problem

    var p = document.getElementById("P").offsetLeft;
    // P = table <td> id

    document.getElementById("Products").style.left = p + "px";

    //Products = div id which has a hidden table

    worked perfect in IE6 anyways. I'm happy. Thankx for the help. That last post sent me in the right direction.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles