Scroll effect not working

JavaScript
, ,
1

hi I’m using odometer.js for my page which just counts up to certain numbers. I want the number to go from 0-600 when I reach that certain section. At the moment its just doing it straight so the user wouldn’t even if know that the effect has taken place. I’ve tried to use waypoint but can’t to get the effect right.

heres my html code the odometer class is the class that make the odometer.js work:

<div class="col span-1-of-3 stat-container js--section-features">
	    <script>
			window.odometerOptions = {
			  format: '(ddd).dd',
			  animation: 'count'
			};
		</script>
		<i class="ion-fork"></i>
	   <div class="odometer odometer1 bigga">0</div>
	   <div class="stats-info"> Meals Made</div>
	   	<script>
			  setTimeout(function(){
				$('.odometer').html(423);
				$('.odometer1').html(633);
				$('.odometer2').html(1003);
			  }, 1000);
		</script>
	   </div>

I was thinking of using waypoint:

$('.js--section-features').waypoint(function(direction){
		
		if(direction == "down"){
			
			$('div'").addClass('odometer');
		
			
		} 
		
		
	} );

But can’t get it to work. Any help would be much appreciated.

2

At a first quick look, there’s that double quote in $('div'") which would break your entire code. Are you familiar with the console? It will tell you about errors like this one immediately. :-)

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.