I want to implement some simple svg manipulation when the window has scrolled to a certain point – either when it has been scrolled by a set number of pixels or when a div or section reaches the top of the viewport.
I'd initially thought it would be straightforward in jquery, but I had a lot of trouble applying smooth transitions to svg elements.
I'm reasonably comfortable in d3, so I'm now hoping to use that. My trouble is that I can't find a way to determine how far the window has scrolled. Multiple SO and Google searches have turned up nothing I can use.
How do I find how much the window has scrolled or where an element is relative to the viewport in d3?
I should emphasise that the problem is that I need to animate svg elements. jQuery does this rather poorly, hence my need for d3.