Flash с наложением Div или HTML и mootools Fx.Slide

Question

Я пробовал несколько различных вариантов CSS, чтобы попытаться наложить HTML на объекты SWF, но у меня было несколько проблем.

1. Safari 4.0.3 ПК:

   SWF-объект всегда отображается выше HTML.

2. Firefox 3.5.6 ПК:

   Рендеринг выглядит хорошо, но при анимации HTML поверх SWF'ы div слегка мерцают. Я использую класс Fx.Slide из mootools-more-1.2.4.2.js для анимации слоя div. Div только мерцают, когда наложены выше SWF. Использование обычного цвета фона не приводит к ошибке.

Примечание: Раньше у меня была проблема с анимацией Div в Firefox, когда родительский div требовал, чтобы переполнение было установлено на auto, или оно также мерцало бы.

Я знаю, что это странно.

Любая помощь будет принята с благодарностью.

Answer 1

Не зная, с каким CSS вы пытались заставить это работать, я опишу, как я справился с подобной проблемой.

У меня есть SWF, который я хочу заполнить во всем окне браузера, независимо от размера окна. Когда пользователь изменяет размеры окна, событие Flash.RESIZE запускается во Flash, и я соответствующим образом обновляю позиционирование.

Однако странице также необходим заголовок навигации, который использует HTML. Я добавил 50-пиксельный заголовок div в верхней части окна. Этот div не находится внутри div SWF, поэтому теперь SWF div с его высотой 100% проходит на 50 пикселей ниже нижней части окна. Без необходимости прыгать через все виды обручей с причудами браузера, самое простое решение для меня было наложить заголовок div на SWF div, поэтому я установил абсолютную позицию div заголовка. Я не устанавливаю z-index для любого объекта - position: absolute для заголовка div заботится об этом.

Кроме того, мой заголовок div содержит раскрывающееся меню, которое перекрывает SWF при активации. Это меню не мерцает во время анимации и работает нормально во всех основных браузерах на Mac и Windows.

Кроме того, я не использую SWFObject для встраивания SWF. Я использую код публикации Flash CS4 HTML, чтобы сделать эту работу, поэтому может быть проблема с SWFObject. Вот код для встраивания, который Flash CS4 создает для меня. Вы можете получить некоторые настройки здесь для использования в настройках SWFObject (метод javscript AC_FL_RunContent поставляется в отдельном файле JS, предоставленном CS4 при публикации):

<script language="JavaScript" type="text/javascript">
        AC_FL_RunContent(
            'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0',
            'width', '100%',
            'height', '100%',
            'src', 'assets/flash/MySWF',
            'quality', 'high',
            'pluginspage', 'http://www.adobe.com/go/getflashplayer',
            'align', 'middle',
            'play', 'true',
            'loop', 'true',
            'scale', 'noscale',
            'wmode', 'opaque',
            'devicefont', 'false',
            'id', 'MySWF',
            'bgcolor', '#333333',
            'name', 'MySWF',
            'menu', 'true',
            'allowFullScreen', 'true',
            'allowScriptAccess', 'sameDomain',
            'movie', 'assets/flash/MySWF',
            'salign', ''
            ); //end AC code
    </script>
    <noscript>
        <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="100%" height="100%" id="MySWF" align="middle">
        <param name="allowScriptAccess" value="sameDomain" />
        <param name="allowFullScreen" value="true" />
        <param name="movie" value="assets/flash/MySWF.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#333333" /><embed src="assets/flash/MySWF.swf" quality="high" bgcolor="#333333" width="100%" height="100%" name="MikeHoltzman" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
        </object>
    </noscript>

Answer 2

Я пытался сделать то же самое, что и вы некоторое время назад, я обнаружил, что невозможно получить кросс-браузерное решение, в каком-то смысле всегда флэш-память, отображаемая перед любым компонентом HTML.

я не могу вам помочь, извините :( но я просто хотел рассказать о моем опыте, чтобы вы не тратили столько же времени, как и я: D

Answer 3

Убедитесь, что ваш swf wmode установлен на прозрачный