2009年10月8日木曜日

背景をFlashで動いてるように見せる方法

index_1254927157699

→サンプル

背景に動きを持たせたい。
スタイルシートのbackgroundで背景画像を指定するように動画を設置したい。

そんなときに使える方法を調べました。

最初はcssでswfを背景に指定するんかと思ったけど違うみたいですね。

positionでうまいこと位置を指定して背景に見せてる感じかな。

以下コード
------------------------------------------------------------------------------------------------------

[HTML]

<body>
<object type="application/x-shockwave-flash" width="550" height="400" data="index.swf">
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
</object>
<div id="content">
<img src="title.gif" alt="" />
<p>背景をFlashで動かすサンプルです。Flashの上に文字をのせることもできます。テキストはいるテキストはいるテキストはいるテキストはいるテキストはいるテキストはいる</p>
</div>
</body>

[CSS]

body{
margin:0;
padding:0;
position:relative;
}

object {
position:absolute;
top:0;
right:0;
z-index:0;
outline:none;
}
#content {
position:absolute;
top:30px;
left:30px;
margin:0;
z-index:5;
}

なにかとつかえそうですね。

0 件のコメント:

コメントを投稿