플래시 마스크를 실현하는 두 가지 방법
17153 단어 플래시 마스크 효과
iframe 모드 코드는 다음과 같습니다.
- <!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=utf-8" />
- <title>flash </title>
- <style>
- *{margin:0;padding:0;}
- body{background-color:#333;font:12px/1.5 tahoma;color:#CCC;padding-top:0!important;}
- #doc{width:980px;height:720px;margin:auto;position:relative;}
- #swf{width:980px;height:720px;overflow:hidden;position:relative;z-index:1;}
- #myIframe{width:470px;height:498px;position:absolute;top:78px;left:391px;z-index:100;}
- </style>
- </head>
- <body>
- <div id="doc">
- <div id="swf">
- <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="980" height="720" id="bigswf">
- <param name="movie" value="flash.swf" />
- <param name="quality" value="high" />
- <param name="allowScriptAccess" value="always" />
- <embed src="flash.swf" width="980" height="720" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="always" id="bigswf"></embed>
- </object>
- </div>
-
- <iframe id="myIframe" src="http://www.baidu.com" frameborder="0" scrolling="no"></iframe>
- </div>
- </body>
- </html>
플래시 투명 모드 설정 코드는 다음과 같습니다.
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="viewport" content="width=device-width">
- <title></title>
- <meta name="description" content="">
- </head>
- <body>
- <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="300" height="200">
- <param name="movie" value="http://market.duowan.com/fodder/0912/124497660688.swf" />
- <param name="wmode" value="transparent" />
- <param name="quality" value="high" />
- <param name="menu" value="false" />
- <param name="swfversion" value="8.0.0" />
- <!--[if !IE]><!-->
- <object type="application/x-shockwave-flash" data="http://market.duowan.com/fodder/0912/124497660688.swf" width="300" height="200">
- <param name="wmode" value="transparent" />
- </object>
- <!--<![endif]-->
- </object>
- <style>
- #mask{
- width:200px;
- height:100px;
- //background-color:#FFF;
- position:absolute;
- top:0;
- left:0;
- }
- </style>
- <div id="mask">
- <a href="http://www.duowan.com">mask</a>
- </div>
- </body>
- </html>