Morphing content based on window part focus
- by Adrian A.
What I'm trying to achieve is basically have a code that will morph ( move around the page ) based on the part of the window which is currently viewed.
Scenario :
- actual page height : 2000px
- actual screen height( pc, laptop whatever ) : 800px
- 1 image of 600px
- 3 div's or virtual boxes ( just to prove what I want to do )
Workflow
When you open the page, you'd see the first part of the page with the image loaded in the first div.
What I want and need to achieve is when scrolling the page, and the focus would be on the second div ( or the image simply gets out of focus - you can't see it no more ),
the image would move ( disappear from the first box ) and appear in the second one, which is currently visible.
The idea might seem pretty easy but I'm not Javascript savvy.
Ideally, the answer should include a way to load a Javascript instead of that image.