Responsive Html5 Video Resolution

Я пишу простую веб-страницу, используя отзывчивый веб-дизайн, поэтому CSS3 медиа-запросы для обслуживания различных таблиц стилей в зависимости от разрешения экрана. Чтобы не усложнять, скажем, что есть версия для iphone и версия для настольных компьютеров. Я использую тег html5 video для показа видео, и я хотел бы показывать видео 720p, когда сайт доступен на настольном компьютере, и видео меньшего размера, 320p, когда сайт доступен на iphone. Я ошибаюсь или нет простого способа сделать это с помощью html/css? Нужно ли использовать javascript для динамического изменения атрибута src видео? Если да, то какова наилучшая практика? Заранее спасибо.