Изменить источник видео по размеру экрана ⇐ Javascript

[Anonymous]

Я хочу переключить источник видео в зависимости от размера экрана. Так что он загружает небольшое и большое видео. Я надеюсь, что мой сайт работает/загружается быстрее. На данный момент он работает с jQuery, но я хочу его в чистом Javascript. < /P>
my html: < /p>

Код: Выделить всё

< /code>
Вот мой код jQuery: < /p>
const mainVideo = $('#myVideo');

const medi      = "/videos/ground_540p.mp4";
const large     = "/videos/ground_1080p.mp4";

switch ( true ) {

case ($(window).width() >= 1080):
mainVideo.append("");
break;

case ($(window).width() >= 720):
mainVideo.append("");
break;

}
< /code>
Это мой чистый Javascript: < /p>
const mainVideo = document.getElementById("myVideo");

const medi      = "/videos/ground_540p.mp4";
const large     = "/videos/ground_1080p.mp4";

switch ( true ) {

case window.innerWidth >= 1080:
mainVideo.append("");
break;

case window.innerWidth >= 720:
mainVideo.append("");
break;

}

В моем инспекторе Firefox он отображается, но серый. Оно не отображается (не загружается). Вот изображение:


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

Подробнее здесь: https://stackoverflow.com/questions/793 ... creen-size