Смена класса у блока при прокрутке - скролле

На фрейморке UIKIT: Ссыль.

Так же можно посмотреть со скриптом (нужно скачать и подключить предложенный на странице).

CSS

.hidden{
	opacity:0;
}
.visible{
	opacity:1;
}

jQuery

jQuery(document).ready(function() {
	jQuery('.post').addClass("hidden").viewportChecker({
	classToAdd: 'visible animated fadeIn',
	offset: 100
	});
});

Работает данный скрипт следующим образом: если наш блок находится в невидимом поле браузера ему присваивается класс hidden, который скрывает наш блок, после того как наш блок только доходит видимой части окна ему тут же присваивается класс visible вместе с классом от Animate.css, который добавляет красивую анимацию при появлении. Вот и весь секрет :)