2013-07-24 2 views
1

первый раз, с нетерпением жду участия.создание встроенного видео реагирования

Я пытаюсь вставить видео с частной услуги хостинга (я работаю в университете) на наш сайт, и у меня возникли проблемы с его отзывчивостью. В отличие от видео Youtube или Vimeo, высота и ширина, кажется, определены в «ЦСИ», как показано ниже:

<iframe width="640" height="385" src="http://videolibrary.sheffield.ac.uk/player?autostart=n&fullscreen=y&width=640&height=385&videoId=6432&quality=hi&captions=n" frameborder="0" scrolling="no"></iframe> 

мне удалось исправить это довольно просто с видео Youtube, прежде чем с помощью следующей CMS (и размещение кода вставки в соответствующем div)

<style type="text/css"> 
.video-container iframe, 
.video-container object, 
.video-container embed { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}</style> 

Однако это просто не работает здесь. Я не могу найти способ редактировать код встраивания, и я не могу найти никаких советов, где бы вы ни работали с этим. Если у кого-нибудь есть идеи, я буду очень благодарен!

+0

Возможный дубликат [Shrink a Youtube video to responsive width] (http://stackoverflow.com/questions/15844500/shrink-a-youtube-video-to-responsive-width) – davidcondrey

ответ

1

Я думаю, что этот плагин jQuery для встраивания видеоизображений в ширину может помочь вам, посмотрите!

http://fitvidsjs.com/

+0

Спасибо за отзыв, но, к сожалению, это кажется, ничего не делает, если я не добавил его неправильно. Если что-то оно только что заставило размеры видео, и остальная часть страницы ответила на него, хотя, глядя на детали, я не думаю, что поддерживаемый видеопроигрыватель поддерживается. –

+0

Есть возможность добавить собственного поставщика видео. Дополнительную информацию смотрите в документации по адресу https://github.com/davatron5000/FitVids.js. – MGDTech

+0

Это все еще не работает. Это просто обрезает видео, а не изменяет его размер. Я ожидаю, что это может быть связано с деталями «& width = 640 & height = 385» в исходном URL-адресе видео. Если я удалю это, то видео исчезнет вместе. –

0

Я использовал CSS, чтобы сделать это. Для моих использования (встраивание видео с Vimeo на отзывчивом сайте), это прекрасно работает в браузерах я проверил в:

@media screen and (max-width: 750px) { 
    iframe { 
     max-width: 100% !important; 
     width: auto !important; 
     height: auto !important; 
    } 
} 

Он не требует заполнителей изображения, так что это довольно просто.

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