Почему не видео не останавливается при сколле?

Question

[Антон]

Нужно останавливать видео, когда видимая область вышла за пределы экрана. Для этого использую плагин: isInViewport и вот такой код:

$('video).each(function(){
    if ($(this).is(":in-viewport")) {
        $(this)[0].play();
    } else {
        $(this)[0].pause();
    }
});

Но почему-то ничего не работает.
https://jsfiddle.net/qqur5gcg/1/

UPD:
Решил проблему так.

$(window).scroll(function() {
        if ($(window).scrollTop() > 600) {
			$('video')[0].pause();
        } else {
			$('video')[0].play();
        }
    });

Но хочется понять, почему не работает тот код.

Comments

[Dmitriy Uvarov]

При копировании потеряли кавычку или это оригинал?

[Антон]

Дмитрий Уваров: да, затупил и даже не заметил)

[Dmitriy Uvarov]

Странно, но у меня ни один из ваших вариантов не работает, может быть в первом варианте нужно событие и обработчик? Да, в первом примере, в переменной this разве не ссылка на объект анонимной функции?

Answer 1

[Bushizzle]

Почему бы не использовать getBoundingClientRect() ?
Проверил, с ним все точно работает: https://jsfiddle.net/9uqhzqvt/

Comments

[Антон]

Да я уже сделал похожим образом.