Как вы устанавливаете data-sr c для телефона против рабочего стола для видео - PullRequest
0 голосов
/ 10 марта 2020

Глядя на этот код, я не могу понять, как сайт решает, загружать ли видео версию SD или HD из Vimeo.

  

<video
tabindex="-1"
role="presentation"
preload="auto"
data-src='{"phone": "https://player.vimeo.com/external/xxxxxx.sd.mp4?s=e178cfb40802c3a61da43abccebbe1f4d7460d48&profile_id=xxx", "desktop": "https://player.vimeo.com/external/xxxxxx.hd.mp4?s=70bf2b2131b71c32119a5e6f558077814bb1515b&profile_id=xxx"}'
autoplay
muted
loop
playsinline>
</video>

Полагается ли этот код на JS или это определено в CSS через медиа-запрос? Как вы на самом деле подтверждаете, что этот код обслуживает видео SD или HD, например, на мобильном устройстве?

1 Ответ

0 голосов
/ 11 марта 2020

В итоге я использовал этот код, который использует медиа-запросы.

    <video preload autoplay loop muted playsinline>
  <source src="https://player.vimeo.com/external/395038718.hd.mp4?s=a49ee0cfb60c92ecbb053c00de10305783207ab3&profile_id=174" media="only screen and (min-device-width: 568px)">
  </source>
  <source src="https://player.vimeo.com/external/395038718.sd.mp4?s=ef8b2e5d56817dddead406621420754eb510807f&profile_id=164" media="only screen and (max-device-width: 568px)">
  </source>
  </video>
...