Перейти к содержимому


Видео И Карты В Мобильной Версии


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 4

#1 bscgroup

bscgroup

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 285 сообщений
  • ГородЕкатеринбург

Отправлено 15 Июль 2017 - 17:21

Добрый день при переходе на страница где есть карта или видео , например связь с администрацией карта очень большая. Нужно что бы карты и видео принемали размер по адаптивному шаблону, если сайт меньше то и содержимое тоже. Так нужно везде.
Заранее спасибо.

#2 Mr.Nito

Mr.Nito

    Активный участник

  • Модераторы
  • 1 364 сообщений

Отправлено 16 Июль 2017 - 12:08

Просмотр сообщенияbscgroup (15 Июль 2017 - 17:21) писал:

Добрый день при переходе на страница где есть карта или видео , например связь с администрацией карта очень большая. Нужно что бы карты и видео принемали размер по адаптивному шаблону, если сайт меньше то и содержимое тоже. Так нужно везде.
Заранее спасибо.
Карту на странице связь с администрацией поправил.
Приведите, пожалуйста, пример товара с видео в описании

#3 bscgroup

bscgroup

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 285 сообщений
  • ГородЕкатеринбург

Отправлено 16 Июль 2017 - 12:45

Косметика-мелки для волос. В мобильной версии страница с виде выглядят ужасно.

#4 Mr.Nito

Mr.Nito

    Активный участник

  • Модераторы
  • 1 364 сообщений

Отправлено 16 Июль 2017 - 17:03

Просмотр сообщенияbscgroup (16 Июль 2017 - 12:45) писал:

Косметика-мелки для волос. В мобильной версии страница с виде выглядят ужасно.

Через кнопку источник в описании товара
оберните тег видео в блок "video-responsive", тогда оно будет подстраиваться под размер экрана
<div class="video-responsive">
 
  <iframe> Ваше видео с youtube </iframe>
 
</div>

в конце main.css добавьте:
.video-responsive {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow:hidden;
}
.video-responsive iframe,
.video-responsive object,
.video-responsive embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


#5 bscgroup

bscgroup

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 285 сообщений
  • ГородЕкатеринбург

Отправлено 16 Июль 2017 - 17:49

Просмотр сообщенияMr.Nito (16 Июль 2017 - 17:03) писал:

Через кнопку источник в описании товара
оберните тег видео в блок "video-responsive", тогда оно будет подстраиваться под размер экрана
<div class="video-responsive">

<iframe> Ваше видео с youtube </iframe>

</div>

в конце main.css добавьте:
.video-responsive {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow:hidden;
}
.video-responsive iframe,
.video-responsive object,
.video-responsive embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Попробую, большое спасибо за профессиональную помощь.




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных