Установить фиксированную панель навигации поверх iframe?

У меня навигация закреплена в верхней части моей страницы, но если по нему прокручивается видео YouTube, встроенное в iframe, оно отображается поверх навигационной панели (а также любого оверлея или модального окна-div).

Пытался установить на нем z-index, но безуспешно.

Я обнаружил, что вы можете установить wmode = "opaque" для встраиваемого объекта, чтобы заставить его работать со старым стилем встраивания Flash, но я бы предпочел работать с HTML 5 и не требовать особых настроек для встраивания видео.

http://jsfiddle.net/EB6gN/9/


iframe css embed youtube css-position
person Damon    schedule 11.05.2012    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Правильный ответ - установить wmode = opaque в качестве строки запроса YouTube для значения src окна iframe.

Для окон iframe отсутствует атрибут Непрозрачный. Полный список разрешенных атрибутов находится здесь: http://www.w3schools.com/tags/tag_iframe.asp

Этот обновленный jsfiddle содержит только HTML5 API Embed YouTube Method, исключая старый тип встраивания и z-index, которые вам не нужны.
http://jsfiddle.net/EB6gN/16/

Если вы нажмете кнопку воспроизведения, увидите черный экран, это из-за текущей ошибки YouTube HTML5 Flash Fallback. Вы увидите элементы управления, когда iframe станет большего размера, но проигрыватель не работает. Для получения этой информации обратитесь к этому сообщению SO:
https://stackoverflow.com/a/10560802/1195891

person arttronics    schedule 12.05.2012

arrow_upward
0
arrow_downward

JSFiddle

Вам необходимо установить режим wmode для рамок непрозрачным или прозрачным. А также вам нужно добавить этот параметр к видео на YouTube в iframe.

Подробнее о wmode.

РЕДАКТИРОВАТЬ: установка всего непрозрачного отлично работает, по крайней мере, в Chrome.

person Belladonna    schedule 11.05.2012