Waypoint

Dodanie fajnych animacji wjeżdżających bloków na stronie jest całkiem proste z wykorzystaniem Waypoints i Animate.css

HTML:


<div class="animated fade" id="MyAnimatedBox1"></div>
<div class="animated fade" id="MyAnimatedBox2"></div>

CSS:


.animated.fade {
  opacity: 0;
}

JS:


	$('#MyAnimatedBox1').waypoint(function() {
			$('#MyAnimatedBox1').show().addClass('fadeInLeft');
	}, { offset: '80%' });

	$('#MyAnimatedBox2').waypoint(function() {
			$('#MyAnimatedBox2').show().addClass('zoomIn').removeClass('fade');
	}, { offset: '70%' });

#css

Agnieszka Trefler

Agnieszka Trefler (Ruda) - freelancer, web developer, specjalistka od WordPressa z Wrocławia. Z pasją budowania stron, blogowania i fotografowania. Twórca Inspiracji fotograficznych.