In my case, when scroll down, I want the element fixed only on conditions that other element ON ENTER VIEWPOINT, and the element will be moved out after the other element moving over it.
This is just the quite difficulty for me, I checked lots of resource on this forums, but I did not find one similar sample, most of them are fixed header of fixed background, but from my understanding, I need a way to meet a relative fixed position but not absolute fixed position, right?
Yeah, I don’t think I’ve seen a specific example of exactly what you’re asking. It even seems a little esoteric for general JS scrolling libraries, but might exist in some… I’m not too familiar with all of them out there.
Ultimately the code would need to calculate a new box position when the scrolling is complete. You could go the route of setting the position to fixed during the intersection period or adjusting the position whenever a scroll event is detected. The fixed method might yield better results as the browser can make sure it stays in place vs. always having to change it which could result in flicker.
The easiest way to do it would be to just have fixed values/scroll numbers to go off of. The more complicated route would be taking into account the box sizes and intersections.
I’d say if you are thinking of hiring someone, it is probably a 1-3 hour task to get it all working right.
Although I wouldn't trust @jonathan's timing as Hype 4 was due 1st quarter of this year
Also, it's highly doubtful that you're ever gonna find an exact sample here that's gonna fit exactly what you are asking. It's gonna be more a case of taking some examples and piecing together what you need. As J states though, it's quite an odd one even for existing libraries so .... I don't envy you. I'd definitely break it down in steps and see where you can get to. Even if you are looking for help here maybe break it down into manageable chunks and go from there.
