2014-10-13 4 views
1

Я пытаюсь вставлять видео на свой сайт, используя iframes. Видео отлично отображено в Chrome, но в Firefox и Safari видео увеличены, и только часть его может быть видна. Я пытался использовать преобразования, но безрезультатно. Я также пробовал разные размеры, проценты и авто для iframe и div. Ни один из них не работал. Благодарим вас за помощь заранее.видео iframe не отображается правильно

Ссылки на скриншоты:

Firefox: http://puu.sh/cb8Mk/2c7e268cba.png

Chrome: http://puu.sh/cb8OH/7abe55f0e2.png

Safari: http://puu.sh/cb8WJ/22873cdaaa.png

Это то, что происходит, когда я пытаюсь использовать преобразования с Firefox: http://puu.sh/cbaZa/61e9c241c6.png

I ' м, используя AngularJS. Вот HTML и CSS.

<div id="video-container"> 
    <iframe id="iframe-video" height="285px" width="510px" ng-src="{{ videoMove }}" frameborder="0" controls></iframe> 
</div> 
#video-container { 
    float:right; 
    padding: 0px; 
    margin: 0px; 
    width: 60%; 
    height: 285px; 
    overflow:hidden; 
    background-color: #000000; 
} 

#iframe-video { 
    width: 100%; 
    height: 100%; 
    display: block; 
    position:relative; 
} 
+0

Где размещаются видео? Иногда встраивание видео приводит к js/css. Кроме того, попробуйте установить размер в css OR inline в самом iframe. Не используйте оба варианта, это может запутать много браузеров. – jorblume

+0

Различные браузеры обрабатывают 'iframe' по-разному. Я заметил это, когда я помещал PDF в 'iframe' на нескольких браузерах. В некоторых браузерах содержимое будет соответствовать, в других вы увидите только часть страницы. Это технологически другое окно. Убедитесь, что материал, который входит в ваш 'iframe', имеет тот же точный размер, что и' iframe', включая отступы, поля и границу. – PHPglue

+0

@jorblume видео находятся в общей папке. – Soubriquet

ответ

0

Может быть, вы должны попробовать использовать <video> тег вместо фрейма.

+0

ng -src не работает с тегом видео. https://github.com/angular/angular.js/issues/1352 – Soubriquet

Смежные вопросы