How to prevent Flash from covering HTML div elements

How to prevent Flash from covering HTML div elements
Today when I was writing a flash advertising code, because the links that come with flash can easily be mistaken for pop-up ads, I made a div layer and put it on top of the flash, so that the links are triggered by a and will not be intercepted. However, I found that flash has always been on the div layer. It turns out that flash needs to add a parameter.

The method to place flash under the DIV layer so that flash does not block the floating layer or drop-down menu, and the key parameter to prevent Flash from blocking the floating objects or layers is: wmode=opaque.

Here’s how:

For IE, add the parameter <param name="wmode" value="opaque" /> in <object></object>
For FF, add the parameter wmode="opaque" in <embed />

123WORDPRESS.COM Use code:

XML/HTML CodeCopy content to clipboard
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >   
  2. < html   xmlns = "http://www.w3.org/1999/xhtml" >   
  3. < head >   
  4. < meta   http-equiv = "Content-Type"   content = "text/html; charset=gb2312"   />   
  5. < title > 22cn </ title >   
  6. < style   type = "text/css" >   
  7. <!--
  8. body {
  9. position:relative;
  10. z-index:0;
  11. margin:0; padding:0
  12. }
  13. body,td,th {
  14. color: #333333;
  15. }
  16. *{margin:0; padding:0}
  17. img{ border:0}
  18. #jb51{ position:relative; width:300px; height:250px}
  19. #div1 {
  20. position:absolute;
  21. left:0;
  22. top:0;
  23. width:300px;
  24. height:250px; z-index:-1
  25.   
  26. }
  27. #div2 {
  28. position:absolute;
  29. left:0;
  30. top:0;
  31. width:300px;
  32. height:250px;
  33. z-index:99999;
  34. }
  35. -- >   
  36. </ style > </ head >   
  37. < body >   
  38. < div   id = "jb51" >   
  39. < div   id = "div1" >   
  40. < script   type = "text/javascript" >   
  41. document.write(' < 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" > ');
  42. document.write(' < param   name = "movie"   value = "http://img.jb51.net/image/22cn_jb51net.swf"   /> ');
  43. document.write(' < param   name = "quality"   value = "high"   /> < param   name = "wmode"   value = "opaque"   /> ');
  44. document.write(' < 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 > ');
  45. document.write(' </ object > ');
  46. </ script >   
  47. </ div >   
  48. < div   id = "div2" >   
  49. <​   href = "http://i.am.cn/?s=jb51pic2"   target = "_blank" > < img   src = "http://img.jb51.net/image/touming.png"   width = "300"   height = "250" /> </ a >   
  50. </ div >   
  51. </ div >   
  52. </ body >   
  53. </ html >   
Standard Flash Insert

XML/HTML CodeCopy content to clipboard
  1. <!-- Standard Flash insert
  2. Set the height and width:
  3. width = "400"   height = "400"   
  4. Set the path:
  5. data = "style/flash/001.swf" and value = "style/flash/001.swf"   
  6. Alternative text or alternative image:
  7. <​   href = ""   title = "" > < img   src = ""   alt = ""   /> </ a > You can also omit this part
  8. -- >   
  9. < object   type = "application/x-shockwave-flash"   data = "style/flash/001.swf"   width = "400"   height = "400" >   
  10. < param   name = "movie"   value = "style/flash/001.swf"   />   
  11. <​   href = "style/flash/001.swf" > < img   src = "style/img/001.jpg"   alt = "Flash Animation"   /> </ a >   
  12. </ object >   
Flash that does not cover the layer

XML/HTML CodeCopy content to clipboard
  1. <!-- Flash that does not cover the layer
  2. Key properties to prevent Flash from blocking floating objects or layers:
  3. < param   name = "wmode"   value = "opaque"   />   
  4. < embed   wmode = "opaque" > </ embed >   
  5. -- >   
  6. < object   type = "application/x-shockwave-flash"   data = "style/flash/001.swf"   width = "400"   height = "400" >   
  7. < param   name = "movie"   value = "style/flash/001.swf"   />   
  8. < param   name = "wmode"   value = "opaque"   />   
  9. < embed   wmode = "opaque" > </ embed >   
  10. <​   href = "style/flash/001.swf" > < img   src = "style/img/001.jpg"   alt = "Flash Animation"   /> </ a >   
  11. </ object >   
Transparent Flash

XML/HTML CodeCopy content to clipboard
  1. <!-- Transparent Flash
  2. Key properties to make Flash transparent:
  3. < param   name = "wmode"   value = "transparent" >   
  4. -- >   
  5. < object   type = "application/x-shockwave-flash"   data = "style/flash/001.swf"   width = "400"   height = "400" >   
  6. < param   name = "movie"   value = "style/flash/001.swf"   />   
  7. < param   name = "wmode"   value = "transparent" >   
  8. <​   href = "style/flash/001.swf" > < img   src = "style/img/001.jpg"   alt = "Flash Animation"   /> </ a >   
  9. </ object >   
wmode Property/Parameter Value Window | Opaque | Transparent
Template variables: $WM, (optional) Enables the use of transparent Flash content, absolute positioning, and layered display features in Internet Explorer 4.0. This tag/attribute is only valid on Windows with the Flash Player ActiveX control.

"Window" plays the application in its own rectangular window 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 everything behind it on the page.
"Transparent" causes the background of the HTML page to show through any transparent parts of the application and may degrade animation performance.
Both "Opaque windowless" and "Transparent windowless" interact with HTML layers, allowing a layer above a SWF file to obscure the application. The difference between the two options is that "Transparent" allows transparency, so if a portion of the SWF file is transparent, the HTML layer below the SWF file can show through that portion, while "opaque" does not.

If this property is omitted, the default value is Window. Applicable only to object.

<<:  Some conclusions on developing mobile websites

>>:  CSS to achieve the like card effect in the lower right corner of the web page (example code)

Recommend

Detailed explanation of JavaScript animation function encapsulation

Table of contents 1. Principle of animation funct...

Detailed explanation of Vue component reuse and expansion

Table of contents Overview Is the extension neces...

MySQL uses SQL statements to modify table names

In MySQL, you can use the SQL statement rename ta...

Html long text automatically cuts off when it exceeds the tag width

When we display long text, we often need to interc...

Details of using vue activated in child components

Page: base: <template> <div class="...

Detailed installation process of nodejs management tool nvm

nvm nvm is responsible for managing multiple vers...

Tutorial on using $attrs and $listeners in Vue

Table of contents introduce Example Summarize int...

How to store images in MySQL

1 Introduction When designing a database, it is i...

MySQL Optimization: InnoDB Optimization

Study plans are easily interrupted and difficult ...

Summary of the difference between using from and join to query two tables in MySQL

Preface In MySQL, multi-table join query is a ver...

Use CSS to set the width of INPUT in TD

Recently, when I was using C# to make a Web progra...

How to deal with the prompt "Operation not permitted" when deleting files in Linux

Colleagues often ask, when deleting files/directo...

How to add sudo permissions to a user in Linux environment

sudo configuration file The default configuration...

jQuery plugin to implement stacked menu

A jQuery plugin every day - stacked menu, for you...

JS 4 super practical tips to improve development efficiency

Table of contents 1. Short circuit judgment 2. Op...