Видеоклип на веб-странице | ВесьТоп создание и продвижение сайтов

Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

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

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Видеоклип на веб-странице

Видеоклип на веб-странице

В этой статье я покажу вам, как быстро и легко добавить фильм на веб-страницу вашего сайта. В результате при загрузке страницы отображается поле с выбранным вами изображением. Когда вы щелкаете по картинке, фильм запускается, а по окончании заголовок отображается снова. Статья состоит из двух частей:

Часть I Сжать фильм в формате flv

В первую очередь пленку необходимо обработать, чтобы размер подошел к полотну. Одноминутный фильм, загружаемый с камеры, может иметь размер до десятков мегабайт. Чтобы он подходил для веб-страницы, вы должны сначала сжать и уменьшить размер экрана (ширину и высоту). Цель состоит в том, чтобы сделать фильм меньше 10 МБ, чтобы он запускался быстро и не приводил к сбою браузера на старых компьютерах.

Вот несколько вариантов, как снять видео:

— Конвертируйте свой фильм прямо через сайт media-convert.com.

— С помощью настольной программы под Windows сжимайте видео с помощью бесплатной программы VirtualDub или этой программы.

— На сайте animoto.com создается видеоролик. Примерно из 15 фотографий вы можете сделать видео длительностью до 30 секунд. Вы можете выбрать музыку для видео или загрузить свою музыку. Когда фильм будет готов, вы можете скачать его и загрузить на свой сайт.

— Под Linux у меня установлены mplayer и mencoder, и я использую следующие команды командной строки (написанные в одной строке):

1. При сжатии фильма 4: 3

mencoder -forceidx -of lavf -oac mp3lame -lameopts abr: br = 56 -srate 22050 -ovc lavc -lavcopts vcodec = flv: vbitrate = 250: mbd = 2: mv0: trell: v4mv: cbp: last_pred = 3 -vf scale = 440: 330 -o out.flv in.mpg

из исходного фильма in.mpg создает сжатую копию с именем out.flv, изменяя размер экрана по ширине 440 и высоте 330 точек, звук кодируется в формате mp3. Если вы хотите, чтобы экран был больше, вы можете изменить его размер, сохранив соотношение сторон 4: 3, например 640×480, но размер файла увеличится.

2. При сжатии фильма 16: 9

mencoder -forceidx -of lavf -oac mp3lame -lameopts abr: br = 56 -srate 22050 -ovc lavc -lavcopts vcodec = flv: vbitrate = 250: mbd = 2: mv0: trell: v4mv: cbp: last_pred = 3 -vf scale = 480: 270 -o out.flv in.avi

здесь исходный файл — in.avi, а выходной файл — out.flv — 480×270 пикселей. Вы можете попробовать больший размер, например, 640×360 пикселей.

Достаточно кодирования. Мы предполагаем, что файл out.flv имеет подходящий размер не более нескольких мегабайт. Теперь поместим его в веб-плеер.

II. часть. Загрузить фильм в формате FLV на веб-страницу

В основном веб-каталоге создайте каталог с видео и загрузите свой фильм out.flv и файлы https://ganbox.com/video/player.swf и https://ganbox.com/video/swfobject.js. Если хотите, загрузите картинку, которая будет отображаться до выхода фильма. Должен быть такого же размера, как экран. В этом примере изображение называется logo.png.

В корневом каталоге создайте файл video.html со следующим кодом:

lt; titlegt; Видеоклип; / titlegt; lt; мета http-Equiv ="Тип содержимого" содержание ="текст / html; charset = UTF-8"gt; lt; h1gt; Видеоклип; / h1gt; lt; тип скрипта ="текст / javascript" src ="/video/swfobject.js"gt; lt; / scriptgt; lt; div id ="медиа пространство"gt; videolt; / divgt; lt; тип скрипта ="текст / javascript"gt; lt; br / gt; var s1 = новый SWFObject (‘/ video / player.swf’, lt; br / gt; ‘ply’, ‘660’, ‘400’, ‘7’, ‘# ffffff’); lt; br / gt; s1.addParam (‘allowfullscreen’, ‘истина’); lt; br / gt; s1.addParam (‘allowscriptaccess’, ‘всегда’); lt; br / gt; s1.addParam (‘режим wmode’, ‘непрозрачный’); lt; br / gt; s1.addParam (‘flashvars’, ‘file = / video / out.flv& controlbar = более& lt; br / gt; displayclick = ссылка& screencolor = FFFFFF& autostart = false& lt; br / gt; image = / video / logo.png ‘); lt; br / gt; s1.write (‘mediaspace’); лт; бр / гт; lt; / scriptgt;

Отлично

var s1 = новый SWFObject (‘/ video / player.swf’, ‘ply’, ‘660’, ‘400’, ‘7’, ‘# ffffff’);

замените 660 шириной пленки и 400 высотой.

Код:

lt; p id ="line18"gt; s1.addParam (‘flashvars’, ‘file = / video / out.flv& amp; controlbar = более& amp; displayclick = ссылка& amp; screencolor = FFFFFF& amp; autostart = false& amp; image = / video / logo.png ‘); lt; / pgt;

пишется слитым в одну строку.

Вот и все. Теперь откройте страницу http://domain.com/video.html, где domain.com — это имя вашего сайта.

В качестве рабочего примера вы можете посмотреть код видео с Виллы Ливадето (я должен сказать, что я не имею никакого отношения к чалге ??????)

Код в примере является допустимым кодом HTML по стандартам W3C.

Вы можете узнать больше об используемом проигрывателе FLV, поддерживаемых форматах и ​​дополнительных настройках здесь.

Читайте так же:
Not found

Нам доверяют

Интернет магазин