Дорогие друзья. Недавно решил использовать именно эту технологию внедрения видео на сайт, но столкнулся с проблемой кроссбраузерности. Многие источники говорят, что запись должна иметь примерно следующий вид:
<video preload autoplay loop>
<source src="video.mp4" type="video/mp4" />
<source src="video.webm" type="video/webm" />
<source src="video.ogv" type="video/ogg" />
<object style="width: 100% !important; height: auto !important;" type="application/x-shockwave-flash" data="fallback.swf">
<param name="movie" value="fallback.swf" />
<param name="flashvars" value="autostart=true&file=video.flv" />
</object>
</video>
Этот код, вроде как(!), должен отображаться везде, mp4 должен идти первым в связи с багами 2010-го года на ipad, ipod и иже с ними. Но тем не менее сафари на любом устройстве дает мне вот такую штуку:
(верхний правый угол "живой", а фон(который и задумывался как видео) стоит картинкой.
Та же проблема и с андроидами(там просто картинка), хотя вроде делал фикс флешовый, как видно в коде.
Подскажите, как всю эту хурму сделать кроссбраузерной, кто уже это делал, в общем, поделитесь опытом.