スキップメニュー:コンテンツへナビゲーションへ

乱雑モックアップ   らんざつ[乱雑] (名・形動)[文]ナリ 入り乱れていること。乱れていて秩序がないこと。また、そのさま。

swfを背景にする

2009年 9月 2日 |

flash |

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリーのブックマーク数

demo|swfを背景にする

swfはcssのbackgroundで指定しても背景にならないけれど、背景ぽく見せる方法メモ。

躓いたところ
swfがobjectのwidth、height100%で縦横100%にならなかった
cssでwidthとheightを100%指定して解決
動画のfitのさせ方(対策は後述)

html

<object type="application/x-shockwave-flash" width="320" height="240" title="title" data="swf/mov.swf">
	<param name="movie" value="swf/mov.swf" />
	<param name="quality" value="high" />
	<param name="wmode" value="transparent" /><!-- Flashを下に -->
</object>
<div id="contents">
<p><img src="img/menu.png" width="440" height="340" alt="透過png" /></p>
</div>

css(すでにresetしているとして)

body {
	overflow:hidden;/*スクロールバーを消す*/
}
object{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}
#contents{
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-220px;
	margin-top:-170px;
}

疑問点
z-indexは必要か?
swfとコンテンツの順番によっては必要だった
z-indexなしでswfの前にhtml要素が来る場合swfが上になる。
swf側のz-indexをコンテンツより小さくする。

object{z-index:0;}
#contents{z-index:1;}

swfをフィットさせるためには
AS2|Stage.scaleMode = “noBorder”;
AS3|stage.scaleMode=StageScaleMode.NO_BORDER;
これがわからなくてflvはfitしないのか?なんて諦めかけてた。

http://help.adobe.com/ja_JP/AS3LCR/Flash_10.0/flash/display/Stage.html#scaleMode

再読み込み(F5やブラウザのボタン両方)の反応が悪かったり良いことないなぁ


コメントはまだありません »

コメントはまだありません。

この投稿へのコメントの RSS フィード。 TrackBack URL

コメントする

You can add images to your comment by clicking here.




Back to Top↑

あわせて読みたい

Back to Top↑

RSS 乱雑モックアップのフィード

Copyright © 乱雑モックアップ. All Rights Reserved.