hair salon . barbershop
SELF CONFIDENCE . GROOMING . LIFE STYLE
WELCOME TO BARBER HAIR SALON AND BARBERSHOP GROOMING LIFE STYLE AND SELF CONFIDNCE

We create new business approach
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book galley of type and scrambled .
Visit Our Online Shop
WELCOME TO BARBER HAIR SALON AND BARBERSHOP GROOMING LIFE STYLE AND SELF CONFIDNCE

We create new business approach
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem
Ipsum has been the industry's standard dummy text ever since the 1500s, when an
unknown printer took a galley of type and scrambled it to make a type specimen
book galley of type and scrambled .
Professional skills
It is the best way to improve your professional skills and become more valued
33%
WOTLD
1 year
50%
COUNTRY
3 years
65%
CITY
6 years

Как сделать плавный рост значения чисел в блоке FR405 при попадании в зону видимости для Tilda

Анимируем все три цифры при прокрутки сайта до нужного уровня.

В коде меняем 42109880 на номер ID вашего блока FR405

Скрипт вставляем в блок ДРУГОЕ►T123
<script> 
    //Добавляем класс к первой цифре
    $(".t505__number:eq(0)").addClass("numberup1");
    //Добавляем класс ко второй цифре
    $(".t505__number:eq(1)").addClass("numberup2");
    //Добавляем класс к третьей цифре
    $(".t505__number:eq(2)").addClass("numberup3");

	$(function () { 
		var target_block = $(".numberup1"); // Ищем блок 
		var blockStatus = true;  
		$(window).scroll(function() { 
			var scrollEvent = ($(window).scrollTop() > ($(target_block).offset().top - $(window).height())); 
		
			if(scrollEvent && blockStatus) {  
				blockStatus = false; // Запрещаем повторное выполнение функции до следующей перезагрузки страницы. 
			    //Анимация цифры 1
				$({numberValue: 0}).animate({numberValue: 55}, { 
					duration: 3000, // Скорость анимации, где 500 - 0.5 одной секунды, то есть 500 миллисекунд 
					easing: "swing", 
					step: function(val) {  
						$(".numberup1").html(Math.ceil(val)+"%"); // Блок, где необходимо сделать анимацию 
						t505__createPieChart('42109880', Math.ceil(val) ,Math.ceil(val)+12, Math.ceil(val)+31 ,'','#ededed','#592a11','#fff','3','15','160');
					} 
				}); 

				//Анимация цифры 2
				$({numberValue: 0}).animate({numberValue: 67}, { 
					duration: 3000, // Скорость анимации, где 500 - 0.5 одной секунды, то есть 500 миллисекунд 
					easing: "swing", 
					step: function(val) {  
						$(".numberup2").html(Math.ceil(val)+"%"); // Блок, где необходимо сделать анимацию 


					} 
				}); 
				//Анимация цифры 3
					$({numberValue: 0}).animate({numberValue: 86}, { 
					duration: 3000, // Скорость анимации, где 500 - 0.5 одной секунды, то есть 500 миллисекунд 
					easing: "swing", 
					step: function(val) {  
						$(".numberup3").html(Math.ceil(val)+"%"); // Блок, где необходимо сделать анимацию 
					} 
				}); 
			} 
		}); 
	}); 
</script> 
Made on
Tilda