Apologies if this question has already been answered somewhere, but I have been unable to locate a solution (possibly due to my limited knowledge of the correct terminology).
As I scroll on my webpage, I want 3 elements to become fixed once they reach a specific point. However, I am aiming for a more natural effect where they slightly overshoot the designated point, giving them an elastic-like feel before returning to their original position.
This is what I currently have in place:
var jq = jQuery;
jq(window).scroll(function(){
var scroll = jq(window).scrollTop();
if(scroll >= 508){
jq(".butterflies").addClass('stay');
}else{
jq(".butterflies").removeClass('stay');
}
});
.stay{position:absolute;top:1100px;}
The use of the jq variable is necessary because it's within a WordPress environment.