Ускорение загрузки страницы с embeded видео с Youtube
Часто на страницу сайта требуется добавить видео с youtube. Сам по себе код видео не сильно загружает страницу, н если таких видео нужно 4 и больше? Это достаточно тормозит загрузку.
Случайно на просторах интернета был найден способ замещения видео изображением и открытием видео при нажатии. Наверняка есть и более продвинутые методы и скрипты, но этот рабочий и элементарный :)
Все, что нужно, это добавить код:
|
<div onclick="$(this).replaceWith('<iframe width=\'100%\' height=\'364\' src=\'http://www.youtube.com/embed/w-7rVHZUeLE?autoplay=1&rel=0\' frameborder=\'0\' allowfullscreen></iframe><br/>');"><img src="http://clubsar.ru/assets/templates/turfirma/main-video.jpg" width="100%"/></div> |
Можно задать произвольные размеры.
Еще одним плюсом такого решения можно назвать возможность поставить любую заглушку, даже анимированную. В общем, есть простор для творчества.
Пример работы (видео воспроизводится при нажатии):
