JS Animated. Как работать с фоновым видео

Команда техподдержки представляет вашему вниманию туториал по работе с фоновым видео в шаблонах JS Animated.

Если в вашем шаблоне используется фоновое видео, вы можете заменить его другим видео или картинкой:

1. Соединитесь с FTP или менеджером файлов в панели управления хостинга..

2. Откройте папку video. Здесь вы увидите 3 видеофайла и 3 изображения.

3. Ваше видео также надо загрузить в 3х примерах: video.ogv, video.mp4 и video.webm для правильного отображения во всех браузерах. Если у вас есть видео только в одном формате, другие можно создать с помощью различных конвертеров видео, например бесплатного инструмента Any Video Converter.

4. Загрузите свои видео на сервер после создания видео во всех форматах, заменив файлы из демо шаблона. После этой замены ваше видео будет отображаться на сайте.

5. Если вы собираетесь заменить видео статичным изображением просто переименуйте или удалите видеофайлы из папки video на сервере. Если видео на загрузится, автоматически будут отображаться изображения video.gif, video.png и video.jpg . Пожалуйста, обратите внимание, что на мобильных устройствах всегда отображается изображение, но не видео: в Safari на iOS (это касается всех устройств, включая iPad), где пользователь может использовать соединение по сети сотовой связи с платой, что взимается за единицу данных, предварительная загрузка и автозапуск видео отключены по умолчанию.

6. Для изменения параметров видео вам надо будет отредактировать файл script.jsиз папки /js. Найдите этот код:

   		/* Video library 
   		========================================================*/ 
   		include('js/jquery.vide.js'); 
   		$(document).ready(function () { 
   		$("#home").vide("video/video",{ 
   		volume: 1, 
   		playbackRate: 1, 
   		muted: true, 
   		loop: true, 
   		autoplay: true, 
   		position: "50% 50%" // Alignment 
   		}); 
   		$('#home video').fadeOut(0).delay(200).fadeIn(800); 
   		});
   		

   Здесь вы сможете изменить громкость звучания видео, выбрать, надо ли его проигрывать автоматически, повторять и т. д.

Вы также можете воспользоваться детальной видео-инструкцией: