Как отрабатывать скрипт jquery, когда он в поле зрения?

Question

[zhyshy]

Подскажите, как сделать выполнение скрипта только тогда, когда он попадает в поле зрения (доскролили до нужного места).

Вот сам скрипт:

$('.count').each(function () {
		$(this).prop('Counter',0).animate({
        Counter: $(this).text()
    }, {
        duration: 4000,
        easing: 'swing',
        step: function (now) {
            $(this).text(Math.ceil(now));
        }
    });
	});

Если стоит класс count, то запускается счетчик от 0 до нужной цифры.
<span class="count">3211000</span>

Answer 1

[imhuman]

И обрати внимание, что скрипт не может быть "в поле зрения" или вне его. Его работа не зависит от положения на странице. Ему вообще место в отдельном файле. Поэтому надо ориентироваться на видимость элемента, над которым этот скрипт выполняет действие.

Comments

[imhuman]

jsfiddle.net/n4pdx/279 "минутка гугления", самый простецкий пример нашел

[Kovalsky]

Строго говоря скрипт может быть в поле зрения, т.к. сам он находится во вполне себе самостоятельной ноде, к которой можно применять стили и обращаться (в том числе из самого скрипта).

Но всё же это чисто теоретически, а так да, я не могу придумать оправдания такому подходу, гораздо проще ориентироваться на видимость нужных элементов.

[imhuman]

Соглашусь с теорией. Сейчас посидел-подумал зачем бы мне накатить стиль на <script>? Так и не придумал. Пропал во мне бунтарский дух - сижу грущу...

Answer 2

[Kovalsky]

Можно использовать $-сниппет onAppearanceApply.

el.onAppearanceApply( function(){
    console.log( this.is( el ) ); // true
} );