Не работает viewportChecker, в чем проблема?

Question

[Oleg Belyay]

Всем привет!
Ни как не могу решить проблему с плагином jquery.viewportchecker.js
У меня на странице происходит анимация чисел и я хочу сделать, чтобы эта анимация происходила в тот момент, когда пользователь до скролит до этих чисел.

Реализовал я это вот так.

В шапке скрипты я подгружаю так:

<script src="js/jquery-2.2.3.min.js"></script>
		<script src="js/jquery.viewportchecker.js"></script>
		<script src="js/jquery.easing.min.js"></script>
		<script src="js/jquery.animateNumber.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="js/custom.js"></script>

javascript код в head кладу

jQuery(document).ready(function ($) {
				$('.count-box').viewportChecker({
				offset: 250,
				callbackFunction: function(elem, action){
						$('#count1').animateNumber(
						  {
							number: 80,
							easing: 'easeOutQuad', 
								numberStep: function(now, tween) {
								var floored_number1 = Math.floor(now),
								target = $(tween.elem);
								target.text('> ' + floored_number1);
								}
						  },
						  8000
						);
						$('#count2').animateNumber(
						  {
							number: 15,
							easing: 'easeOutQuad', 
						  },
						  6000
						);
						$('#count3').animateNumber(
						  {
							number: 18,
							easing: 'easeOutQuad', 
						  },
						  7000
						);				
						$('#count4').animateNumber(
						  {
							number: 140,
							easing: 'easeOutQuad', 
								numberStep: function(now, tween) {
								var floored_number2 = Math.floor(now),
								target = $(tween.elem);
								target.text('> ' + floored_number2);
								}
						  },
						  8000
						);			
					}
				});	
			});

HTML код

<section class="skill vol-2 count-box">
			<div class="container ">
				<div class="row">
					<div class="col-md-3 col-sm-6">
						<div class="item shadow">
							<span id="count1">0</span>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="item shadow">
							<span id="count2">0</span>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="item shadow">
							<span id="count3">0</span>
						</div>
					</div>
					<div class="col-md-3 col-sm-6">
						<div class="item shadow">
							<span id="count4">0</span>
						</div>
					</div>
				</div>
			</div>
		</section>

Но анимация чисел происходит сразу и пока доскроливываешь до чисел анимация уже прошла.
В чем может быть косяк?