Просмотр полной версии : Как победить перекрывания flash роликом элементов на веб странице
Здравствуйте!
Тема может показаться вам заезженной и неактуальной, но если бы все было так просто, то я бы не писал :)
Вопрос: Имею страницу сайта с различными div блоками, которые должны отображаться поверх flash ролика, но этого не происходит и они перекрываются самим роликом. Что можно сделать?
Дополню: Я использовал всем известные параметры ролика wmode "opaque" и "transparent" в коде страницы, но не помогло. Так же указал для блоков разные z-index и тоже не помогло.
Обращаю внимание на то, что flash ролики создавал не я и исходников у меня нет, иначе бы при компилировании ролика я бы настроил параметры публикации "opaque" или "transparent". Поэтому лично мне кажется, что проблема кроется в этом. Но все равно я буду рад любой помощи с вашей стороны)
"opaque" и "transparent" - верно.
Исходники тут не нужны. Проблема в верстке.
Ссылка на проблемную страницу была бы актуальна.
postoronniy
14.03.2012, 17:59
Привет!
Недавно была такая же проблема. Чат с оператором залезал на рекламные ролики на сайте www.restoreit.ru.
Решил так:
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
<?php if (!empty($width)) echo 'width ="'. $width.'"';?>
<?php if (!empty($height)) echo 'height ="'. $height.'"';?>
>
<param name="movie" value="<?php echo $imageurl;?>" />
<param name="wmode" value="opaque" />
<embed
src="<?php echo $imageurl;?>"
loop="false"
pluginspage="http://www.macromedia.com/go/get/flashplayer"
type="application/x-shockwave-flash"
WMODE="transparent"
<?php if (!empty($width)) echo 'width ="'. $width.'"';?>
<?php if (!empty($height)) echo 'height ="'. $height.'"';?>
/>
Обсуждение здесь: http://joomlaforum.ru/index.php/topic,205110.0.html, результат здесь: www.restoreit.ru
Спасибо за помощь, буду проверять метод postoronniy.
А пока код проблемной области:
<div id="border-game">Этот блок должен быть поверх следующего</div>
<div id="block-play-game">
<?php
echo '<PARAM NAME=movie VALUE="'. $embed_src .'">
<PARAM NAME=quality VALUE="high">
<PARAM NAME=bgcolor VALUE="'. $game->bgcolor .'">
<PARAM NAME="menu" VALUE="false">
<PARAM NAME="wmode" VALUE="opaque">
'.$wttrans2.'
<EMBED id="flash1" src="'. $embed_src .'" wmode=transparent"'. $game->bgcolor .'" width=700"'. $maxwidth .'" height="500"'. $maxheight .'" name="'. $game->title .'" ALIGN="" menu="false" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"'.$wttrans.'>
</EMBED>
</OBJECT>';
?>
</div>
Оборачиваем всё в блок с position:relative и задаем стили, как ниже:
<div style="position:relative">
<div id="border-game" style="position:absolute; z-index:1">Этот блок должен быть поверх следующего</div>
<div id="block-play-game" style="position:absolute; z-index:0">
<?php
echo '<PARAM NAME=movie VALUE="'. $embed_src .'">
<PARAM NAME=quality VALUE="high">
<PARAM NAME=bgcolor VALUE="'. $game->bgcolor .'">
<PARAM NAME="menu" VALUE="false">
<PARAM NAME="wmode" VALUE="opaque">
'.$wttrans2.'
<EMBED id="flash1" src="'. $embed_src .'" wmode=transparent"'. $game->bgcolor .'" width=700"'. $maxwidth .'" height="500"'. $maxheight .'" name="'. $game->title .'" ALIGN="" menu="false" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"'.$wttrans.'>
</EMBED>
</OBJECT>';
?>
</div>
</div>
И поправьте wmode в <embed> или <object>, у вас он разный там в них.
Должно решить задачу.
mooncar, сделал так как вы написали, но ничего не изменилось.
Есть какие нибудь еще варианты, может через javascript можно сделать?)
Нет, JS не надо трогать.
Без ссылки, без контекста общего документа тяжело понять, почему у вас там так.
mooncar, разобрался я наконец то))
Проблема была тривиальной...необходимо было добавить тег <embed> в начале кода. Раньше этот тег стоял раньше, но почему то не привязывался к началу этого блока с кодом. Вот рабочее решение:
<div style="position:relative">
<div id="border-game" style="position:absolute; z-index:1">Этот блок должен быть поверх следующего</div>
<div id="block-play-game" style="position:absolute; z-index:0">
<?php
echo '<object>';
echo '<PARAM NAME=movie VALUE="'. $embed_src .'">
<PARAM NAME=quality VALUE="high">
<PARAM NAME=bgcolor VALUE="'. $game->bgcolor .'">
<PARAM NAME="menu" VALUE="false">
<PARAM NAME="wmode" VALUE="opaque">
'.$wttrans2.'
<EMBED id="flash1" src="'. $embed_src .'" wmode=transparent"'. $game->bgcolor .'" width=700"'. $maxwidth .'" height="500"'. $maxheight .'" name="'. $game->title .'" ALIGN="" menu="false" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"'.$wttrans.'>
</EMBED>
</OBJECT>';
?>
</div>
</div>
<object> только...
Ну отлично.
Чтобы забыть рукописные <object> и <embed> как страшный сон, правильность и соответствие всех их параметров, исключить необходимость предварительного клика, используйте для публикации флешки SWFObject (http://designformasters.info/posts/flash-embed-with-swfobject-2/).
Вопрос решен :)
mooncar, postoronniy, спасибо за помощь!
Работает на vBulletin ® версия 3.7.3. Copyright ©2000-2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Copyright © 1999-2008 Flasher.ru. All rights reserved.