Уже не первый раз меня спрашивают, как бороться с проблемой, когда Flash-ролик виден поверх всех слоев несмотря на заданные соответствующим образом параметры z-index.
Дело в том, что для Flash существует параметр wmode и если он не задан явно в коде, то по умолчанию принимает значение window. В этом режиме Flash размещается поверх всех слоев. Для того чтобы перекрыть его, необходимо задать параметр со значением transparent или opaque.
Немного об этих режимах:
- opaque (непрозрачный): Приложение скрывает все содержимое, находящееся под ним. похож на режим window, с той лишь разницей, что в данном режиме можно перекрывать Flash HTML-слоями, используя z-index.
- transparent (прозрачный): Фон HTML-страницы виден сквозь прозрачные области приложения. Этот параметр может замедлить воспроизведение анимации.
Но это ещё не всё. Как обычно, мы столкнёмся с проблемой кроссбраузерности.
Для ИЕ ссылку на флеш нужно задавать в теге param, который внутри тега object:
<object type="application/x-shockwave-flash">
<param name="movie" value="ВАШ ФАЙЛ.swf" />
<param name="wmode" value="transparent" />
...
</object>
Для других браузеров, нужно добавить этот параметр как свойство data к тегу object:
<object type="application/x-shockwave-flash" data="ВАШ ФАЙЛ.swf">
<param name="wmode" value="transparent" />
...
</object>
Так что лучше всего было бы совместить оба эти способа, чтоб работало кроссбраузерно:
<object type="application/x-shockwave-flash" data="ВАШ ФАЙЛ.swf">
<param name="movie" value="ВАШ ФАЙЛ.swf" />
<param name="wmode" value="transparent" />
...
</object>
На этой странице справочной системы компании Adobe вы можете подробнее ознакомиться с этим и другими параметрами Flash.
