• Страница 1 из 1
  • 1
Форум » Веб-разработка » HTML + CSS — коды » Создаем эластичное видео на сайте для iframe, object тегов
Создаем эластичное видео на сайте для iframe, object тегов
workman
Вторник, 05 Января 2016 | Сообщение 1
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
HTML5 видео
Видео на HTML5 можно с легкостью сделать эластичным, при изменении размеров окна, с помощью max-width:100%.
Не работает с тегами iframe и object
Код
video {
    max-width: 100%;
    height: auto;
}

Для Iframe и Object
Нужно обернуть код тегом DIV и указать для параметра padding bottom процентное значение от 50% до 60%.
Код
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


Код
<div class="video-container">
    <iframe src="ссылка на ролик" width="800" height="450" frameborder="0"></iframe>
</div>
Страна: (RU)
workman
Вторник, 05 Января 2016 | Сообщение 2
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Цитата Kosten ()
Это также мне не понятно, что то знакомое Iframe и Object и все
Оно растянет ролик на ширину поля указанных размеров. Какой бы ролик небыл бы добавлен, он автоматически будет увеличен
Страна: (RU)
csretven
Среда, 06 Января 2016 | Сообщение 3
Оффлайн
Пользователи
Сообщений:54
Награды: 0
Эластичное видео, сначало прочел как эпическое. biggrin
Страна: (RU)
Марковичь
Среда, 06 Января 2016 | Сообщение 4
Оффлайн
Vip
Сообщений:65
Награды: 0
Да что проверять, уже установлено, просто кто заходит на сайт, вот такое окно появляется. Код копируем и кидаем в низ сайта.



Но она еще поеп не доработана, так как другое изображение поставлю.
Прикрепления: 6955834.png (175.0 Kb)
Страна: (RU)
Kosten
Среда, 06 Января 2016 | Сообщение 5
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
nikolla76, эта не та тема. cool
Страна: (RU)
FeStemBer
Четверг, 07 Января 2016 | Сообщение 6
Оффлайн
Проверенные
Сообщений:355
Награды: 1
Цитата workman ()
Не работает с тегами iframe и object

Тат с них все плееры начинаются.
Страна: (RU)
Форум » Веб-разработка » HTML + CSS — коды » Создаем эластичное видео на сайте для iframe, object тегов
  • Страница 1 из 1
  • 1
Поиск: