У меня есть видео Vimeo на странице с помощью универсального кода вставки:
<div class="video">
<iframe src="http://player.vimeo.com/video/VIDEO_ID" width="100%" height="100%" frameborder="0"></iframe>
</div>
Я использую API-интерфейс Vimeo JavaScript (http://vimeo.com/api/docs/player-js) для добавления класса в video div(который удваивает div) для того, когда видео начинает воспроизводиться, и когда видео приостанавливается или заканчивается, класс удаляется, сбрасывая размер видеоплеера до его исходного размера.
Это работает, как и ожидалось, на рабочем столе/ laptop (Firefox), но на телефоне Android iframe (после удвоения его размера) не возвращается к своему предыдущему размеру (это процент, поэтому он должен адаптироваться к своему video контейнеру), что вызывает iframeчтобы перекрыть родительский div.
Сначала я подумал, что это ширина и высота iframe на 100%, поэтому я указал фиксированную ширину и высоту для iframe, используя $('#video1').attr('width', 400);, когда видео остановлено, ноiframe остался неизменным (он остался в два раза больше).
У кого-нибудь есть идеи, почему Android это делает и как я могу принудительно изменить размер iframe?