Как поместить свой элемент поверх видео Youtube
Например, следующим образом можно убрать сточку с навигацией от Youtube:
<div>
<div style="z-index: 1">
<object width="500" height="309">
<param name="wmode" value="transparent"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/fAYMgOh1y9Q?rel=0&autoplay=1&loop=1&border=0&showinfo=0&color1=0xffffff&color2=0xffffff&disablekb=1&wmode=opaque" type="application/x-shockwave-flash" width="500" height="309" allowscriptaccess="always" allowfullscreen="true" wmode="transparent"></embed>
</object>
</div>
<div style="position: relative; bottom: 30px; z-index: 2; background: #FFFFFF; width: 500px; height: 30px;">
</div>
</div>
На что нужно обратить внимание:
1) wmode: transparent и параметр wmode=opaque
2) z-index у видео Youtube должен быть меньше чем у элемента, который вы размещаете поверх
3) position: relative; bottom: 30px; у стиля DIV, который располагается поверх видео. Число пикселей и направление сдвига выбираете сами.
Как это выглядит
Пример 1 (внизу нет навигации):
Пример 2 (Свой текст поверх плеера Youtube):
Я ничего не понял. Мне, например, интересно, как поместить полупрозрачный текст(шрифт)поверх видео изображения на youtube?
@gossha
Вместо этого пишешь то что тебе надо:
< div style="position: relative; bottom: 30px; z-index: 2; background: #FFFFFF; width: 500px; height: 30px;" >
Внутри тегов можно и текст воткнуть.
@gossha
Второй пример добавил с текстом.
Спасибо. Статья помогла