3日目の伊藤商店サイトを作った際のチップス。
FLASHを背景にしきたい場合、次のような感じにするといいみたい。
HTMLソース：Swfobjectを使用して配置
[html]
<div id="content">
<h1>伊藤商店</h1>
<p>伊藤商店はステキなwebクリエイターです</p>
</div>
<div id="flash">
<div id="flashcontent">
<strong>このサイトでは<a href="http://www.adobe.com/jp/products/flashplayer/" target="_blank">Adobe Flash Player</a>が必要です。</strong><br />
Adobeのサイトより最新の<a href="http://www.adobe.com/jp/products/flashplayer/" target="_blank">FlashPlayerをダウンロード</a>してください。
</div>
<script type="text/javascript">
// <![CDATA[
var so = new SWFObject("itoshoten.swf", "sotester", "100%", "100%", "10", "#000000");
so.addVariable("flashVarText", "this is passed in via FlashVars for example only");
so.addParam("wmode", "transparent");
so.addParam("scale", "noscale");
so.write("flashcontent");
// ]]>
</script>
</div>
[/html]
※swfobjectについては過去の記事を参照してちょ。
CSSソース
[css]
#content {
position: relative;
z-index: 1;
}
#flash {
position: absolute;
z-index:0;
top:0;
left:0;
width:100%;
height:100%;
}
[/css]
z-indexでレイヤーを指定して使う。
古いブラウザによっては正常に見えない可能性もあるが、
IE6より前のブラウザとかは、無視したいところ。。。