Topic awaiting preservation: What's the Scroll Offset. (Page 1 of 1)

So I have This page here

Which as far as I can tell should work on recent versions of FF, IE & OP

Anyway everything is in pretty good shape except in the right hand side example where if you scroll the div everything goes wacky. I can scroll the page, but not the div. I'm assuming I need to add some sort of offset for the scroll in the div but I can't figure out whether I need to add it to the x and y coordinates of the mouse or of the div or what.

Any Ideas?

Oh the most relevant Lines I believe are lines 194 - 197 where I figure out the offset of the div relative to the mouse position, lines 113 - 115 (and lines 59 - 60, same code) where I get the mouse coordinates, and somewhere in function checkNodeCollision on 288 where I figure out what to do with the blank node that takes up space while dragging.

Oh there's two helper include files as well. The first debug.js has 2 functions debug() which just outputs any input to the div that gets dropped at the end and dump() which will output the properties of any object passed to it.

the windowEvents.js file has 2 functions (addDocumentEvent() and addWindowEvent() ) which allow me to stack multiple functions on one document/window event.

Feel free to steal any code.

Thanks!



.:[ Never resist a perfect moment ]:.

(Edited by bitdamaged on 09-23-2005 18:21)

no you don't have to add offset ... theres a fundamental flaw ... probably a browser side bug that causes it ... i don't think you can do much ... the problem is obviously connected to the position of the scroll bar ... you can't get a scroll bar position value can you? or if you can then there's your solution

that's my humble opinion ... i didn't get into the code much ... so i may be wrong

[uber_quick_reply]

the position of the scrollbar is :

scrollPositionX = window.scrollX?window.scrollX:document.body.scrollLeft
scrollPositionY = window.scrollY?window.scrollY:document.body.scrollTop

In you script you seem to use only document.body.scrollLeft and document.body.scrollTop

[/uber_quick_reply]

quote:

---

scrollPositionX = window.scrollX?window.scrollX:document.body.scrollLeft
scrollPositionY = window.scrollY?window.scrollY:document.body.scrollTop

In you script you seem to use only document.body.scrollLeft and document.body.scrollTop

---

that's only for the x and y positions of the mouse and only being used for IE though I'm pretty sure those are correct, if I just place the div where those coords go with no offsets the dragger goes to the correct spot. Also everything works when you scroll the page, it's just the scrolling of the div that throws things off.

When I line up the dragger, the only offsets I'm using right now are the ones I need to place the div where I want it so it floats relative to where you clicked on the div.

I think what I need to somehow figure out is the scrolling offset of the div.



.:[ Never resist a perfect moment ]:.

You should be able to access properties like offsetTop and scrollTop across the usual browsers.

eg. someDiv.offsetTop returns the relative Y position of the element, scrollTop returns its Y scroll offset much like on the window. In your case, someDiv.scrollTop should return what you're looking for.

It appears that Moz/IE etc. act slightly differently with window scroll and width/height measurement properties depending on the DTD and thus rendering mode (strict/standards vs. quirks mode, etc.)

Yeah I actually figured this one out using the scrollTop and scrollLeft of the parent containers.



.:[ Never resist a perfect moment ]:.