Pocket

Dramatiques.のリニューアルするために今制作していたんですが、ちょっとした困った事がありまして・・・。

SWFObject使ってます。
ver2.1です。

IE6,7では表示は大丈夫。
けれど、Firefox2.0、3.0はNG。

なんじゃこりゃ?

で、いろいろと検索してみると、IE7で表示されないケースが多かった。
俺は????って途方にくれる。。。

が、こんな記事を発見!

[Closed] Firefox 3 issue – SWF with 100% dimensions

Firefox 3 issue – SWF with 100% dimensions

I embedded a 100% height 100% width Flash movie using SWFOjbect a while ago. It’s been working perfectly in all the main browsers – it covers the whole of the available window. But now Firefox 3’s come out, the SWF only appears in a 200 pixel high strip at the top of the page. The 100% width seems to be OK. Is this some kind of Firefox 3 bug?

リンク先参照ですが、簡単にいえば、
「Flashの設定でSWFOjbectを使ってるんですけど、高さ100%に設定してるのに、なんで200pxまでしか表示されないんだ?もしかして、Firefox 3のバグなのか?」
ということ。

俺と同じ意見。

で、そんなことはないだろうと。デグレードしてたらあかんし。

で、日本語の記事が発見できたので、ご紹介です。

nGさんが書いてくれていました。感謝。

Flashのバグ回りメモ

swf(Flash)ファイルを100%表示で指定した場合、表示領域が高さ200pxになってしまう。

発祥環境:Win&Mac Mozilla, Firefox, Netscape
これに関してはMozillaのバグなのでしょうか、すでに一年以上経過していることからなおす気がないのでしょうかFirefox1.0らへんのころからですね。

uu-uu.comさんところで紹介されいるCSSでbodyにwidth:100%,height:100%を指定して回避方法はスマートかも。ただここらへんは微妙なところで、ユーザーがCSS解除してたり強制CSSなど見てたりする場合は表示がおかしくなるのだけれど、いや、そもそもそういうユーザーはFlashなんて見ないのでは?とかなんかどうでもいい思考をめぐらしています。

blog:uu-uu.com

Flash 100%表示バグ+Another HTML-lint
Macromedia – Flash TechNotes : 100 パーセントに設定されている Flash Player ムービーが正常に表示されない
きむさんから指摘されて色々対応策をやってみた。
現状では、XHTMLではやらないほうがええみたいですね。
ということでDOCTYPEを入れてAnother HTML-lintで100点とれましたよ、やっと。
面倒なことだ。

あ、XHTMLでDOCTYPEいれてもいける方法ありました。
CSSは以下。

[dec]
@charset “utf-8”;

html, body{
margin:0;
padding:0;
}

body {
background:#FFF;
position:absolute;
width:100%;
height:100%;
}
[/dec]

今更なんだが、こんなバグみたいなのがあったのは初めて知りました。
FlashのActionscript内におまじないをかければ、ちゃんと高さも幅も100%で表示されますが、回避策として。

しっかし、びっくりしましたね。
ぴったり200pxでしたので、自分でソースに200とか設定したかなぁ?って見直してみましたが、ないし・・・。どうなってるんだ?って感じでした。

CSSで設定で回避中ですけど、またソースにおまじないかけておきます。

From xxxYukihiroxxx

P.S
参考に現象をLinkしておきます。
http://dramatiques.dyndns.org/sample/

Firefoxで観覧してください。
IEだと普通に表示されます。

Pocket

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください