Adds a class of “first” to the first element that has a class of “activity” that is visible in the browser window.
$(window).scroll(function(){
var scrollTop = $(window).scrollTop();
var windowHeight = $(window).height();
var first = false;
$(".activity").each( function() {
var offset = $(this).offset();
if (scrollTop <= offset.top && ($(this).height() + offset.top) < (scrollTop + windowHeight) && first == false) {
$(this).addClass("first");
first=true;
} else {
$(this).removeClass("first");
first=false;
}
});
});
This helped me out of a jam I was in for days, and completely solved my problem. Thanks so much, this is a fantastic site!
Unless I misunderstand, this requires that div’s bottom is higher than the bottom of the screen (that the element is completely visible). I personally would prefer that it require that the element is at all visible (top < screen bottom).