Determining position

Discussion in 'Javascript' started by Let_Me_Be, Sep 9, 2006.

  1. Let_Me_Be

    Let_Me_Be Guest

    I have some floating divs on my page.

    When I click the div I want do display a menu over it, how can I
    determine the position of the clicked div on the page?
     
    Let_Me_Be, Sep 9, 2006
    #1
    1. Advertising

  2. http://www.quirksmode.org/dom/getstyles.html
    You are probably looking for the top and left style values.

    Let_Me_Be wrote:
    > I have some floating divs on my page.
    >
    > When I click the div I want do display a menu over it, how can I
    > determine the position of the clicked div on the page?
     
    Joshie Surber, Sep 9, 2006
    #2
    1. Advertising

  3. Let_Me_Be

    Guest

    Let_Me_Be wrote:
    > I have some floating divs on my page.
    >
    > When I click the div I want do display a menu over it, how can I
    > determine the position of the clicked div on the page?


    Richard Cornford wrote about the difficulty in doing this in general

    <URL:
    http://groups.google.com/group/comp.lang.javascript/msg/c46e8ec2f5fe4db3?>

    Richard, if you happen to be reading, is there a chance you could post
    a few of the more basic positioning moduals you have written. Or
    perhaps you have a link to one of your pages which uses them?

    Thank you,
    Peter
     
    , Sep 9, 2006
    #3
  4. Let_Me_Be

    Benjamin Guest

    try this:
    function posMenu(menu, menuBase) {
    var offsetObj;
    var offsetX, offsetY = 0;
    offsetObj = menuBase;
    while (offsetObj) {
    offsetX += offsetObj.offsetTop;
    offsetY += offsetObj.offsetLeft;
    offsetObj = offsetObj.offsetParent;
    }
    menu.style.position = "absulote";
    menu.style.top = offsetX + "px";
    menu.style.left = offsetY + "px";
    }
    Let_Me_Be wrote:
    > I have some floating divs on my page.
    >
    > When I click the div I want do display a menu over it, how can I
    > determine the position of the clicked div on the page?
     
    Benjamin, Sep 10, 2006
    #4
  5. Let_Me_Be

    Guest

    Benjamin wrote:
    > try this:
    > function posMenu(menu, menuBase) {
    > var offsetObj;
    > var offsetX, offsetY = 0;


    should be this?
    var offsetX = 0, offsetY = 0;



    > offsetObj = menuBase;
    > while (offsetObj) {
    > offsetX += offsetObj.offsetTop;
    > offsetY += offsetObj.offsetLeft;
    > offsetObj = offsetObj.offsetParent;
    > }
    > menu.style.position = "absulote";


    Should be "absolute"

    > menu.style.top = offsetX + "px";
    > menu.style.left = offsetY + "px";
    > }


    I haven't written a positioning function more advanced then the one you
    have shown but looking at the Yahoo! UI position function it looks like
    the proposed function will only work in a limited set of simple cases
    (ie. no frames etc).

    Peter
     
    , Sep 10, 2006
    #5
  6. Let_Me_Be

    Benjamin Guest

    It is true that it will only work in simple cases (if that's simple),
    but I assumed that is what he wanted.
    wrote:
    > Benjamin wrote:
    > > try this:
    > > function posMenu(menu, menuBase) {
    > > var offsetObj;
    > > var offsetX, offsetY = 0;

    >
    > should be this?
    > var offsetX = 0, offsetY = 0;
    >
    >
    >
    > > offsetObj = menuBase;
    > > while (offsetObj) {
    > > offsetX += offsetObj.offsetTop;
    > > offsetY += offsetObj.offsetLeft;
    > > offsetObj = offsetObj.offsetParent;
    > > }
    > > menu.style.position = "absulote";

    >
    > Should be "absolute"
    >
    > > menu.style.top = offsetX + "px";
    > > menu.style.left = offsetY + "px";
    > > }

    >
    > I haven't written a positioning function more advanced then the one you
    > have shown but looking at the Yahoo! UI position function it looks like
    > the proposed function will only work in a limited set of simple cases
    > (ie. no frames etc).
    >
    > Peter
     
    Benjamin, Sep 10, 2006
    #6
  7. Let_Me_Be

    RobG Guest

    wrote:
    > Benjamin wrote:
    > > try this:
    > > function posMenu(menu, menuBase) {
    > > var offsetObj;
    > > var offsetX, offsetY = 0;

    >
    > should be this?
    > var offsetX = 0, offsetY = 0;
    >
    >
    >
    > > offsetObj = menuBase;
    > > while (offsetObj) {
    > > offsetX += offsetObj.offsetTop;
    > > offsetY += offsetObj.offsetLeft;
    > > offsetObj = offsetObj.offsetParent;
    > > }
    > > menu.style.position = "absulote";

    >
    > Should be "absolute"
    >
    > > menu.style.top = offsetX + "px";
    > > menu.style.left = offsetY + "px";
    > > }

    >
    > I haven't written a positioning function more advanced then the one you
    > have shown but looking at the Yahoo! UI position function it looks like
    > the proposed function will only work in a limited set of simple cases
    > (ie. no frames etc).


    Matt Kruse has a reasonable effort as part of his JavaScript toolkit:

    <URL: http://www.javascripttoolbox.com/lib/objectposition/ >


    There is a simpler version at Quirksmode:

    <URL: http://www.quirksmode.org/js/findpos.html >


    --
    Rob
     
    RobG, Sep 11, 2006
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?ISO-8859-1?Q?Johan_Bernsp=E5ng?=

    determining of the position of the MSB

    =?ISO-8859-1?Q?Johan_Bernsp=E5ng?=, Jul 27, 2004, in forum: VHDL
    Replies:
    20
    Views:
    3,018
    Jonathan Bromley
    Aug 2, 2004
  2. Luqman
    Replies:
    1
    Views:
    657
    Luqman
    Feb 7, 2006
  3. Robin
    Replies:
    0
    Views:
    720
    Robin
    May 12, 2005
  4. James Wong
    Replies:
    4
    Views:
    499
    James Wong
    Jul 14, 2004
  5. CES
    Replies:
    3
    Views:
    91
Loading...

Share This Page