Адаптивность видео

#16 7 мая 2016 в 22:39
Кто подскажет, возможно ли сделать адаптивными страницы добавления объявлений, где располагаются поля выбора рубрик, текстовые поля?
#17 2 февраля 2017 в 21:49
Подниму тему. Почему-то отмеченные выше в этой теме варианты не работают для встраиваемого видео с Rutube. Ютуб, дейлимоушн, вимео адаптивны, а рутуб нет. В чем причина?
#18 2 февраля 2017 в 21:56

вимео адаптивны

al955
У меня в последнее время Vimeo перестал работать, черный экран вместо ролика и по ссылке и по коду. У вас нормально?

----------
попробуйте так.

height: auto!impotant;
width: 100%!impotant;

facebook, twitter не растягиваются обычно, те, что вы назвали должны.
#19 2 февраля 2017 в 22:03


вимео адаптивны

al955
У меня в последнее время Vimeo перестал работать, черный экран вместо ролика и по ссылке и по коду. У вас нормально?

----------
попробуйте так.

height: auto!impotant;
width: 100%!impotant;

facebook, twitter не растягиваются обычно, те, что вы назвали должны.

Нил™

Не работает такой вариант

У меня сейчас нет на сайте видео с вимео. Раньше было с этими же стилями CSS и все было адаптивно
#20 9 апреля 2017 в 21:39
Подниму тему. Как сделать адаптивным видео на двойке в статьях?
#21 9 апреля 2017 в 22:15


Подниму тему. Как сделать адаптивным видео на двойке в статьях?

al955

тоже интересно, как вставленное видео через редактор сделать адаптивным
#22 9 апреля 2017 в 22:35
Сейчас оно "адаптивно" только в том смысле, что адаптивен контейнер, в котором оно находится, т.е., он не вылезает за границы страницы. Само же видео неадаптивно и получается обрезанным

На единице я делал видео адаптивным, но здесь этот css-код не подходит
#23 30 июля 2017 в 23:01
Подниму тему. Очень нужно сделать видеоролики адаптивными в статьях. Перепробовал много вариантов, ничего не работает. Двойка. Шаблон mtheme.animaweb.pro/
#24 31 июля 2017 в 13:24
Не пойму в чем проблема.
Ну вот, к примеру, такой код вполне адаптивный, проверено:
  1.  
  2. <iframe allowfullscreen="" src="//www.youtube.com/embed/JGCsyshUU-A" width="775" height="500" frameborder="0">
  3. </iframe>
  4.  
Иногда я использую такой метод:
  1.  
  2. <div style="
  3. position: relative;
  4. padding-bottom: 56.25%;
  5. padding-top: 30px;
  6. height: 0;
  7. overflow: hidden;">
  8. <iframe id="ytplayer" style="
  9. position: absolute;
  10. top: 0;
  11. left: 0;
  12. width: 100%;
  13. height: 100%;"
  14. width="auto" height="auto" src="https://www.youtube-nocookie.com/embed/JGCsyshUU-A?rel=0&amp;controls=0&amp;showinfo=0&amp;enablejsapi=1&amp;autoplay=1" frameborder="0" allowfullscreen>
  15. </iframe>
  16. </div>
  17.  
Здесь задаём относительное позиционирование для родительского блока и абсолютное для встроенного, назначив ему ширину и высоту 100%, чтобы видеоплеер смог растягиваться или сжиматься в соответствии с внешним контейнером.
padding-bottom: 56.25% задаёт высоту для 16:9, для 4:3 поставьте 75%.

Кроме того, в дополнениях есть куча специальных полей для видео. Я использую поле и плеер от InstantVideo, там реклама вырезается.
#25 1 августа 2017 в 09:16
Спасибо, в диве работает. Поля не использовал, т.к. видео вставляю прямо в текст статьи
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.