Warning: session_start(): open(/home/imailer/.system/tmp/sess_rqjrg56h8th8g8iuf0btkg0530, O_RDWR) failed: Disk quota exceeded (122) in /home/imailer/note-marketing.com/www/wp-content/plugins/custom-sidebars/inc/external/wpmu-lib/functions-wpmulib.php on line 69
Адаптивное видео – Сео и интернет маркетинг заметки для работы.

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

Written by
  • 2 года ago

При создании адаптивного сайта, нужно чтобы было адаптивным и все видео на сайте. Сейчас мы покажем как сделать адаптивным видео из Youtube, Vimeo,…

Видео из YouTube

Видео из YouTube вставляется на сайт с вставкой кода с применением тэга iframe либо с помощью тэга embed (старый код).

Например этот код позволяет вставить на сайт видео клип Адриано Челентано:

Указанный способ позволяет вставить видео, которое пока еще не адаптивно. То есть при изменении размеров браузера, видео не будет уменьшатся.

Адаптивное видео в YouTube

Для того чтобы сделать видео из YouTube адаптивным, нужно сделать следующее:
1) Вставить тэг iframe с видео в

, то есть сделать так:

2) В стилевой файл прописать такой код:

После этого наше видео станет адаптивным:

Отметим что данная технология будет работать и для вставки видео с помощью тэга embed (просто вставляете код видео в

):

Адаптивное видео в Vimeo

Данная технология позволяет сделать адаптивным видео и из Vimeo, для этого просто вставляете код с видео в <div class="myvideo">...</div> а затем прописываете вышеуказанные стили в стилевой файл (файл CSS).

Адаптивные карты Google и Яндекса

При вставке видео из YouTube использовался тэг iframe, этот тэг используется и в картах Google и Яндекса. Поэтому технология превращения обычного видео в адаптивное, будет действовать и для карт Google и Яндекса (точно также вставите код с картой в <div class="myvideo">...</div>):

 

Leave a Comment

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Menu Title

Warning: Unknown: open(/home/imailer/.system/tmp/sess_rqjrg56h8th8g8iuf0btkg0530, O_RDWR) failed: Disk quota exceeded (122) in Unknown on line 0

Warning: Unknown: Failed to write session data (files). Please verify that the current setting of session.save_path is correct (/home/imailer/.system/tmp) in Unknown on line 0