How to prevent Flash from blocking div elements in HTML-HTML Tutorial-php.cn

Home

Web Front-end

HTML Tutorial

How to prevent Flash from blocking div elements in HTML

php中世界最好的语言

Jan 26, 2018 am 09:37 AM

flash html element

This time I will show you how to prevent Flash from blocking div elements in HTML. What are the precautions for preventing Flash from blocking div elements in HTML? The following is a practical case. Let’s take a look. .

When I was writing a flash

advertising code today, because the links that come with flash can easily be regarded as pop-up ads, I made a div layer and placed it on top of the flash, so that the links are all The one triggered by a will not be intercepted, but it is found that the flash is always above the div layer. It turns out that the flash needs to add a parameter. How to place flash under the DIV layer, so that flash does not block the floating layer or
drop-down menu, so that Flash does not block the floating object or key parameter of the layer: wmode=opaque. The method is as follows:
For IE, add the parameter in
For FF, add the parameter in Add parameter wmode="opaque"
Script House usage code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
<title>22cn</title>  
<style type="text/css">  
<!--   
body {    
position:relative;    
z-index:0;    
margin:0; padding:0   
}    
body,td,th {   
    color: #333333;   
}   
*{margin:0; padding:0}   
img{ border:0}   
#jb51{ position:relative; width:300px; height:250px}   
#div1 {   
position:absolute;   
left:0;   
top:0;   
width:300px;    
height:250px; z-index:-1    
  
}    
#div2 {    
position:absolute;   
left:0;   
top:0;   
width:300px;    
height:250px;    
z-index:99999;    
}    
-->  
</style></head>  
<body>  
<div id="jb51">  
<div id="div1">  
<script type="text/javascript">  
document.write(&#39;<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="300" height="250">&#39;);   
document.write(&#39;<param name="movie" value="http://img.jb51.net/image/22cn_jb51net.swf" />&#39;);   
document.write(&#39;<param name="quality" value="high" /><param name="wmode" value="opaque" />&#39;);   
document.write(&#39;<embed src="http://img.jb51.net/image/22cn_jb51net.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="300" height="250" wmode="opaque"></embed>&#39;);   
document.write(&#39;</object>&#39;);   
</script>  
</div>  
<div id="div2">  
<a href="http://i.am.cn/?s=jb51pic2" target="_blank"><img src="http://img.jb51.net/image/touming.png" width="300" height="250"/></a>  
</div>  
</div>  
</body>  
</html>

Copy after login

Standard Flash insertion

Set height and width:

width="400" height="400"

Set path:

data="style/flash/001.swf" 与 value="style/flash/001.swf"

Copy after login

Alternate text or alternative image:

<a href="" title=""><img src="" alt="" /></a> 也可以不要这段   
-->  
<object type="application/x-shockwave-flash" data="style/flash/001.swf" width="400" height="400">  
<param name="movie" value="style/flash/001.swf" />  
<a href="style/flash/001.swf"><img src="style/img/001.jpg" alt="Flash动画" /></a>  
</object>

Copy after login

Flash that will not cover the layer

<!-- 不会遮住层的Flash    
让Flash不档住浮动对象或层的关键属性：   
<param name="wmode" value="opaque" />  
<embed wmode="opaque"></embed>  
-->  
<object type="application/x-shockwave-flash" data="style/flash/001.swf" width="400" height="400">  
<param name="movie" value="style/flash/001.swf" />  
<param name="wmode" value="opaque" />  
<embed wmode="opaque"></embed>  
<a href="style/flash/001.swf"><img src="style/img/001.jpg" alt="Flash动画" /></a>  
</object>

Copy after login

Transparent Flash

<!-- 透明的Flash   让Flash透明的关键属性：   <param name="wmode" value="transparent">  -->  
<object type="application/x-shockwave-flash" data="style/flash/001.swf" width="400" height="400">  
<param name="movie" value="style/flash/001.swf" />  
<param name="wmode" value="transparent">  
<a href="style/flash/001.swf"><img src="style/img/001.jpg" alt="Flash动画" /></a>  
</object>

Copy after login

wmode attribute/parameter value Window | Opaque | Transparent

Template variable: $WM, (optional ) allows the use of transparent Flash content,
absolute positioning, and layered display features in Internet Explorer 4.0. This tag/property is only valid on Windows with the Flash Player ActiveX control.
"Window" uses the movie's own rectangular window to play the application on the Web page. "Window" indicates that this Flash application has no interaction with the HTML layer and is always on top.
"Opaque" causes the application to hide all content behind it on the page.
"Transparent" causes the background of the HTML page to show through any transparent parts of the application and may reduce animation performance.
"Opaque windowless" and "Transparent windowless" both interact with HTML layers, allowing the layer above the SWF file to obscure the application. The difference between the two options is that "Transparent" allows transparency, so if a part of the SWF file is transparent, the HTML layer underneath the SWF file can show through that part, while "opaque" does not. .
If this property is omitted, the default value is Window. Applies to object only.

I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!