Помогите разобраться пожалуйста
 

Добрый день. Не могу понять что делаю неправильно.

Есть такая структура

<div class="page"></div>
<div class="page"></div>
<div class="page"></div>
<div class="page"></div>

Есть ссылки при нажатии на которые классу page добавляется page__active - все это замечательно работает.
Но вот пытаюсь реализовать простенькую функцию смены цифр на активной странице таким методом:

<script>
$(function() {
if ($('.page').hasClass('page__active')){
$({numberValue: 0}).animate({numberValue: 10000}, {
duration: 5000, // Продолжительность анимации, где 500 = 0,5 одной секунды, то есть 500 миллисекунд
easing: "linear",
step: function(val) {
$(".num").html(Math.ceil(val)); // Блок, где необходимо сделать анимацию
}
});
}
else{
return false;
}
});
</script>

Но скрипт cрабатывает после рефреша страницы на page__active


Подскажите пожалуйста в чем может быть проблема ?

так сюда и добавляйте, а не в ready, как у вас, ищите нужный click.

У меня на сайте присутствует еще динамическое добавление класса по прокрутке колеса мыши. Скорее всего проблема в том что функция долна проверять наличие класса постоянно или нужно сделать вызов функции в определенном месте страницы - этого я не умею делать ((((

Пока решил проблему через костыль - по событию moseover.

Если кто ни будь знает как сделать это по правильному, буду очень признателен !