iframe z-index в ie8 - PullRequest
Новая
       408

iframe z-index в ie8

0 голосов
/ 13 июля 2011

Привет, извините, каждый мой английский не хорош! Я использую iframe для видео. Над iframe есть выпадающее меню, оно хорошо работает в Firefox, но в ie8 выпадающее меню переходит под iframe. Если я заменю iframe на изображение, оно работает хорошо. Я долго играю со свойствами позиции и z-индекса, но это бесполезно. Пожалуйста, помогите мне, если есть какое-либо решение для избежания этой проблемы !!

1 Ответ

0 голосов
/ 13 июля 2011

Предполагается, что ваше видео воспроизводится Flash ....

Если вы встраиваете Flash, вы должны явно установить для параметра wmode значение opaque, чтобы избежать выпадающих выпадающих объектов позади объекта flash. Вы также можете использовать библиотеку , чтобы разобраться с неприятными деталями встраивания flash в разные браузеры.

РЕДАКТИРОВАТЬ: вместо включения iframe попробуйте это - взяли ваш фильм и использовали ссылку для встраивания, которую представляет youtube в конце фильма: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title>Embedded YT Movie with DIV element on top</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>

        <object style="height: 390px; width: 640px">
            <param name="movie" value="http://www.youtube.com/v/zFJfbDETIIk?version=3">
            <param name="allowFullScreen" value="true">
            <param name="allowScriptAccess" value="always">
            <param name="wmode" value="opaque"> <!-- I added this one wrt youtube's proposed URL -->
            <embed src="http://www.youtube.com/v/zFJfbDETIIk?version=3" type="application/x-shockwave-flash"
                   allowfullscreen="true" allowScriptAccess="always" width="640" height="390" 
                   wmode="opaque" <!-- I added this one wrt youtube's proposed URL -->
                   >
        </object>
        <div style="position:absolute;width:300px;height:300px;top:10px;left:10px;background-color: red;">
            This one should be on top.
        </div>
    </body>
</html>
...