Запретить загрузку видео на мобильное устройство - PullRequest
Новая
       25

Запретить загрузку видео на мобильное устройство

0 голосов
/ 04 декабря 2018

У меня есть видео, которое я не хочу загружать ниже 480 пикселей, поскольку это снижает скорость страницы.

HTML: - 

    <div class="main-vid">
    <video autoplay loop muted playsinline id="myVideo" width="100%" height="100%">
            <source src="/video/home.mp4" type="video/mp4">
            Your browser does not support HTML5 video.
    </video>

Я пробовал следующееJQuery, но видео все еще загружается: - 

if ( $(window).width() > 480) {      

} 
else {
  $('video').hide();
}

У кого-нибудь есть идеи?

Спасибо.

1 Ответ

0 голосов
/ 04 декабря 2018

Я бы предложил установить видео src, когда ширина превышает 480, и сбросить / сбросить src для устройства с менее чем 480. 

if ( $(window).width() > 480) { 
       $('#myVideo source').attr('src','video/mp4');
       $('#myVideo').get(0).load();
       $('#myVideo').get(0).play(); 
} 
else { 
    $('#myVideo source').attr('src',''); 
  }

Ссылка на рабочую скрипку: http://jsfiddle.net/ut1faksr/2/

...