I have a live event site and list of events in a mouse over menu.
The flash streaming player stays in front of the mouse over menu with all versions of IE.
Wmode parameter solved so many people's problem in the past but it does not work in my case. Here is the rendered flash object for player:
<object id="flowplayer" width="100%" height="100%" wmode="transparent" data="http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf" type="application/x-shockwave-flash">
<!-- load configuration from config.js -->
<param name="flashvars" value="config=player.aspx?pID=585&config=1">
<param name="wmode" value="transparent">
<param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf">
<param name="allowfullscreen" value="true">
</object>
I also tried 'wmode=opaque' and did not work.
I'm making an educated guess since you didn't add the code, but try this:
object{z-index:-1}
.menu{z-index:100}
of course .menu should be changed to the class of your menu, but you'll get the idea
Related
I have a CGI in an object (from an ethernet webcam) which works fine for most browsers but not for IE (10). The problem is that my menu should be shown above that element but it isn't. I know of but that - as it seems - only applies to SWF sources in an object. Also, zindex could not help.
In other words, this
<object width="640" height="480" id="Player" classid="CLSID:..." codebase="http://my.server/activex/AMC.cab#version=2,0,22,0" style="z-index: 104;">
<PARAM NAME="_cx" VALUE="16933">
<PARAM NAME="_cy" VALUE="12700">
<PARAM NAME="MediaURL" VALUE="http://my.server/axis-cgi/mjpg/video.cgi?resolution=640x480">
<PARAM NAME="UIMode" VALUE="none">
<PARAM NAME="MediaType" VALUE="mjpeg-unicast">
<PARAM NAME="MPEG2VideoDecodingMode" VALUE="3">
<param name="wmode" value="transparent">
<p>Error</p></object>
does hide an absolutely positioned menu dropdown that should be shown above it.
Any ideas on that?
Best regards,
Mario
I have an embed swf where variable wmode has the value "opaque". I need to keep with value "opaque" because i have to control the swf layer against the others html elements, however wmode "opaque" causes a weird behaviour on MouseDown event.
If the cursor is hidden (by Mouse.hide()) and you try to press the left mouse button, the cursor will show up until you release the left button or move the mouse.
If you've changed your cursor to another one (by MouseCursor) the same bug will happen (i.e the cursor will turn on arrow mode).
First I was thinking that it was my application bug, then i made a quick example and the error persisted.
When I change the wmode value to "window", the error don't happen, but I have to keep with wmode "opaque".
My example:
import flash.events.MouseEvent;
Mouse.hide();
stage.addEventListener(MouseEvent.MOUSE_DOWN,example);
function example(e:MouseEvent){
ExternalInterface.call("console.log", "Hello World!");
}
HTML:
<div id="flashContent">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
width="100%"
height="610px"
id="pl_main">
<param name="movie" value="teste_moude_down.swf" />
<param name="quality" value="high" />
<param name="allowScriptAccess" value="always" />
<param name="bgcolor" value="#ffffff" />
<param name="wmode" value="opaque" />
<embed src="teste_mouse_down.swf"
width="100%"
height="610px"
autostart="true"
quality="high"
bgcolor="#ffffff" wmode="opaque"
name="pl_main"
id="pl_main"
allowScriptAccess="always"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
Use swfobject to embed swf, and you decide a lot of problems with embeding.
I have a site where a jQuery dialog is used to show videos in a modal frame.
I would like to be able to rest the close button so that it partially covers the embedded QuickTime object, much like the modal frame in this picture:
http://ajaxdump.com/wp-content/uploads/2009/08/MooTools_SqueezeBox-Expandable-Lightbox-308x400.gif
QT always renders above any other element.
I've looked around for solutions, but I've had little luck with it. Is this even possible? Or should I just give up hope now?
You need to adjust the wmode parameter of the Quicktime object to "transparent" in order for it to display beneath other content.
You'd want to set it up like this in your HTML:
<object width="500" height="250" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab"
id="video_object" style="behavior:url(#qt_event_source);" class="plugin" >
<param name="src" value="whatever.png">
<param name="autoplay" value="false">
<param name="postdomevents" value="true">
<param name="wmode" value="transparent">
<param name="controller" value="false">
<param name="scale" value="tofit">
<embed id="video_embed" class="plugin"
type="video/quicktime" src="whatever.png"
wmode="transparent" postdomevents="true" controller="false" scale="tofit" >
</embed>
</object>
Have a look at this demo.
I have a html/css based menu and I'm trying to put a flash video in the banner right under it, but when I hover the dropdown section of the menu it ends up behind it.
Is this a z-index problem or do I need to set certain properties on the flash video?
You will need to add a parameter to the Object tag and a property to the embed tag called wmode and set it to transparent like so:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="798" height="190">
<param name="movie" value="flash/home2.swf">
<param name="quality" value="high">
<PARAM NAME="wmode" VALUE="transparent">
<embed src="flash/home2.swf" quality="high" wmode=transparent pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="798" height="190"></embed>
</object>
I have flash like a background on my page and all content on page is in the html tags witch is over that flash, and that works very nice. A cover div for that flash have a fixed position (position:fixed;) in style, that is important for scrolling feature.
My problem is in following when I try to include additional page, in iframe on the center of current page, and that new page containing some flash object, that object is not not visible in iframe, its here but its above the fixed flash object, if I remove (position:fixed;) from style, it is visible, but my scrolling feature not work as before. What css style could solve the problem?
Have you tried adding
<param name="wmode" value="opaque">
to the <object> tag of the flash element you can't see? That may help.
If you are writing HTML 5 scrolling is not supported for Iframe
as stated before use object the object tag, and set paramaters.
<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1000" height="600"><param name="movie" value="mainswf/f_cbt.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="11.0.0.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />