Редактирование HTML кода видеоплеера

Вопрос:

Здравствуйте! Мне очень понравился ваш сайт своей информативностью и доходчивостью изложения материала за что вам большое спасибо!

Но у меня возник вопрос по поводу видеоплеера jwplayer. Я смогла установить на сайт только HTML-код, отображенный на странице «Проигрыватель видео для сайта» (второй вариант), поскольку Java-скрипт у меня на странице не поддерживается. Всё работает и всё замечательно.

Но теперь ломаю голову как правильно прописать в этом коде: автозапуск видеофайла и фоновую картинку на плеер, отображающуюся до воспроизведения и после. Помогите, пожалуйста.

С уважением, Александра.

Ответ:

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

Конкретно по Вашему вопросу:

Для того чтобы сделать автозапуск видео, в теге embed в свойстве flashvars следует прописать параметр (через разделитель-амперсанд) autostart со значением true. Пример кода:

1
2
3
4
5
<embed
...
flashvars='file=http://MuSite/videoplayer/player.swf&autostart=true'
...
/>

Для вставки фоновой картинки надо там же вставить параметр image с адресом картинки:

1
2
3
4
5
<embed
...
flashvars='file=http://MuSite/videoplayer/player.swf&image=http://MuSite/images/image.jpg'
...
/>

Целиком код будет выглядеть так, параметры для автозапуска и заставки видео в строке 18:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' width='360' height='240' id='single1' name='single1'>
<param name='movie' value='http://www.MySite.ru/videoplayer/player.swf'>
<param name='allowfullscreen' value='true'>
<param name='allowscriptaccess' value='always'>
<param name='wmode' value='transparent'>
<param name='flashvars' value='file=http://www.MySite.ru/videoplayer/videoclips/MyClips.flv'>
<embed
type='application/x-shockwave-flash'
id='single2'
name='single2'
src='http://www.MySite.ru/videoplayer/player.swf'
width='360'
height='240'
bgcolor='undefined'
allowscriptaccess='always'
allowfullscreen='true'
wmode='transparent'
flashvars='file=http://www.MySite.ru/videoplayer/videoclips/MyClips.flv&image=http://MuSite/images/image.jpg&autostart=true'
/>
</object>

Давайте ниже посмотрим на практические примеры.

Непрерывное воспроизведение

На всякий случай, добавлю, что для непрерывного воспроизведения видеоролика в коде плеера там же надо вставить параметр repeat=single. Вот пример ролика с автозапуском и непрерывным воспроизведением:

Примечание. Следует помнить, что для корректного отображения фоновой картинки надо отнять от её высоты высоту нижнего тублара плеера. Так, например, в данном случае размер окна плеера 360 на 240 пикселей, высота тулбара 16. Значит, ширину картинки я оставлю 360, а высоту делаю 240 минус 16 пикселей.

Владелец данного сайта. Графический дизайнер, специалист по Фотошопу с опытом 10+ лет. Также веду канал о графическом дизайне на Ютуб и развиваю тематическое сообщество во ВКонтакте. Связаться со мной можно через комментарии, форму обратной связи или по электронной почте [email protected]

Оцените автора
( 46 оценок, среднее 5 из 5 )
RuGraphics
Добавить комментарий