2013-12-24 4 views
0

Мне нужно воспроизвести видео в HTML-файле, а затем в статье Joomla (сначала нужно попробовать на одной странице HTML).Воспроизведение видео в HTML

Я использую этот код:

<video width="500" height="250" controls autoplay> 
<source src="videos/video.wmv" type="video/ogg"> 
<source src="videos/video.wmv" type="video/mp4"> 
<object data="videos/video.wmv" width="500" height="250"> 
<embed width="500" height="250" src="videos/video.wmv">                </object> 
                    </video> 

Я попытался загрузки видео с Youtube, и она отлично работает на Chrome и FF, но не на Opera.

Однако основная проблема - у меня есть avi (230 МБ), которые мне нужно играть. Как я могу это сделать? Преобразовать его в .wmv/.mp4? Или я могу играть в нее как avi без внешних плагинов?

Я попытался переименовать его из .avi в .wmv, попробовал онлайн-конвертеры, но он все еще не работает.

Может ли проблема быть размером? Формат?

+0

Какие онлайн-преобразователи вы пытались? – MultiplyByZer0

ответ

2

У меня обычно есть четыре версии одного и того же видео для кросс-браузерный :

совместимости
<video width="320" height="240" controls> 
    <source src="movie.mp4" type="video/mp4"> 
    <source src="movie.ogg" type="video/ogg"> 
    <source src="movie.webm" type="video/webm"> 
    <object data="movie.mp4" width="320" height="240"> 
     <embed src="movie.flv" width="320" height="240"> 
    </object> 
</video> 

.mp4, .webm, .ogv и флэш запасной вариант .flv. Это сработало хорошо для меня кросс-браузер. Еще одна вещь, которую следует отметить, - это то, что для мобильных устройств более оптимизированное видео с более высоким рейтингомс большей вероятностью будет работать (у меня были проблемы с этим в прошлом).

Источник: Making video tag play in all browsers

+0

Это не помогает. – Alexey

+0

Если вы объясните, каким образом это вам не поможет, мы можем помочь, а не быть неясными. – P1nGu1n

+0

Я все еще не играю. Плеер есть, но видео не воспроизводится. – Alexey

0

вы пытались Video.js? Это с открытым исходным кодом и классный.

В <head>:

<link href="http://vjs.zencdn.net/4.3/video-js.css" rel="stylesheet"> 
<script src="http://vjs.zencdn.net/4.3/video.js"></script> 
<style type="text/css"> 
    .vjs-default-skin .vjs-control-bar { font-size: 60% } 
</style> 

В <body>:

<video id="my_video_1" class="video-js vjs-default-skin" controls 
preload="auto" width="640" height="264" poster="my_video_poster.png" 
data-setup="{}"> 
<source src="my_video.mp4" type='video/mp4'> 
<source src="my_video.webm" type='video/webm'> 
</video> 

Here вы могли бы найти больше.

+0

Пробовал - при использовании .avi он просто показывает значок буфера и ничего больше. – Alexey

Смежные вопросы