SitePoint Sponsor

User Tag List

Results 1 to 5 of 5

Thread: position of div

  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Whistler, Canada
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    position of div

    Hi all,

    I did a bit of searching and noticed that a lot of people have trouble with offsetTop. I have a problem like that too, although the solutions given in the other threads don't seem to work for me.

    So here's my problem:

    On the page I've got a couple of divs (id = pos_x, where x is an increasing number). On the right side of the page I'm trying to get pictures (id = pic_pos_x) positioned to the corresponding div on the left.

    In order to do that I fire this function for each image:

    Code JavaScript:
    function changeImagePos(elementid) {
     
        var obj_pic = document.getElementById('pic_pos_' + elementid);
        var obj_div = document.getElementById('pos_' + elementid);
     
        var pos = findPos(obj_div);
        var value = pos + 'px';
     
        obj_pic.style.top = value;
    }
     
    function findPos(obj) {
        var top = 0;
     
        if (obj.offsetParent) {
            top = obj.offsetTop
            while (obj = obj.offsetParent) {
                top += obj.offsetTop
            }
        }
        return top;
    }
    Note: the elementid in the first function is the number of the div (the x).

    This works great in Firefox. But with Internet Explorer it always returns top = -1.

    I tried some other functions I found on the web but none of them seem to work for me. Any chance any of you can help me out here?

    Thanks in advance.

    Regards,
    Pepe

  2. #2
    SitePoint Evangelist hexburner's Avatar
    Join Date
    Jan 2007
    Location
    Belgium
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code JavaScript:
    function findPos(obj) {
        var top=obj.offsetTop;
        while(obj.offsetParent!=null) {
            obj = obj.offsetParent;
            top += obj.offsetTop;
        }
        return top
    }
    FOR SALE: 1 set of morals, never used, will sell cheap

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Whistler, Canada
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the reply, hexburner.
    However, your function gives me the same result.

    The second line,
    Code JavaScript:
    var top = obj.offsetTop;

    returns -1.

    Could it have something to do with other code surrounding these divs? The divs are both in a different table..

    Cheers.
    Last edited by IP-Dope; Jun 4, 2007 at 07:17.

  4. #4
    SitePoint Evangelist hexburner's Avatar
    Join Date
    Jan 2007
    Location
    Belgium
    Posts
    591
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do you got a full example? Maybe somewhere online?
    FOR SALE: 1 set of morals, never used, will sell cheap

  5. #5
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Location
    Whistler, Canada
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm sorry, I don't have a working example online right now (it's running on a local server), but I'll see if I can get something uploaded.

    Cheers.


Bookmarks

Posting Permissions

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