замените изображение встроенным видео

Question

Привет, я пытаюсь изменить веб-страницу, чтобы она загружалась быстрее.Поскольку у меня есть несколько встроенных видеороликов (blip.tv но могу изменить его на YouTube, если это поможет) Мне было интересно, можете ли вы загрузить изображение, где должно быть видео, и по щелчку заменить изображение на видео и начать воспроизведение (без перезагрузки всей страницы).Я думаю, что видел это раньше, но больше нигде не могу найти!прямо сейчас код для встраивания, который я использую, это:

<object data="http://blip.tv/play/gYMo_vAmAA" type="application/x-shockwave-flash" height="500" width="600"><param name="src" value="http://blip.tv/play/gYMo_vAmAA"><param name="allowfullscreen" value="true"></object>

Спасибо

Answer 1

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

<script type="text/javascript">
    var embedCode = '<object data="http://blip.tv/play/gYMo_vAmAA" type="application/x-shockwave-flash" height="500" width="600"><param name="src" value="http://blip.tv/play/gYMo_vAmAA"><param name="allowfullscreen" value="true"></object>'
</script>

Затем поместите изображение в контейнер div и замените контейнер innerHTML onclick:

<div id="videocontainer">
    <img src="yourimage.jpg" onclick="document.getElementById('videocontainer').innerHTML = embedCode;" height="500" width="600" />
</div>

Answer 2

Есть проект Google code под названием SWFObject, который идеально подходит для того, что вам нужно.Это кроссбраузерная библиотека javascript для загрузки flash - и вы могли бы использовать ее, например, для замены вашего изображения на flash-видео, когда кто-то нажимает на изображение.