トップへ戻るニュースフォーラムFLASH-ML 過去ログBak@Flaダウンロードよくある質問と答
ログイン
ユーザ名:

パスワード:


パスワード紛失

新規登録
メインメニュー
メイン
   コーダーズルーム【スクリプト系】
     CSSの背景画像をFlashにするには?
投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
epiphone
Åê¹ÆNo.48289
投稿日時: 2011-11-21 13:07
新米
居住地:
投稿: 8
使用環境:
Windows7、Adobe Master Collection CS5
CSSの背景画像をFlashにするには?
該当スレッドを探したのですが、Flash絡みのHTML、CSS、JavaScript記述についてはこのスレッドでよろしかったでしょうか。

Flash CS5、Windows7です。

制作したサイトで、ヘッダーに背景画像として大きなイメージを使用しているのですが、それをFlashに差し替えたいです。
ところがこの大きなjpeg画像、CSSで背景画像として表示させており、CSSの背景画像をFlashに記述変更したところで表示は不可能ですよね。
以下のように記述しております。


#wrapper
{
	width: 100%;
	overflow: hidden;
	background: url(../img/home/home_hdr.jpg) no-repeat center 0px;
}


画像サイズは横1430px、縦550pxほどです。
あえてデザインの左右がある程度途切れねばおかしくなるようなそんな意図のデザインにしており、依頼者の都合上これは変えられません。そしてそれを達成するために、配置はセンター配置させております。

背景画像の下部に、背景画像と重なるようにグローバルナビゲーションを設置しているので画像をCSS背景画像にしています。

変わらず背景画像的にFlashを表示させる方法を教えていただけましたらとても助かります。

不足情報あらば追加いたしますので何卒宜しくお願いします。
ひろゆき
Åê¹ÆNo.48291
投稿日時: 2011-11-21 16:19
ちょんまげら
居住地: 東京砂漠
投稿: 4403
使用環境:
10.8.5

Flash Professional CS4/CS6/CC

Safari 6.1
Re: CSSの背景画像をFlashにするには?
まず、使用環境は「アカウント編集」で、その他の項目に記載しておきましょう。

次に、スクリプトは、見やすいように、[code][/code]で囲んで、掲載しましょう。
また、スクリプトはコードを貼り付けるだけでなく、
どこに記述したとか、どんなインスタンスをどこに配置してあるかの情報も必要です。
第三者が再現しやすいような説明を心がけてください。


また、何をなさりたいのか、いまいち分かりません。
第三者が再現できるような説明をなさらないと、
細かい部分については「希望していたのは、こんなのではない!」ということになりかねません。

HTML内で背景画像としてSWFを表示したいのか、
SWF内で背景画像を繰り返し表示したいのか、最低でも、このあたりを明確にすべきでしょう。


----------------
質問する際は、回答者に具体的な情報を与えてください。

epiphone
Åê¹ÆNo.48292
投稿日時: 2011-11-21 16:48
新米
居住地:
投稿: 8
使用環境:
Windows7、Adobe Master Collection CS5
Re: CSSの背景画像を.swfにするには?
教えていただきましてありがとうございます。

マイプロフィール的が画面があってそこに環境を入れるのですか。なるほど。
codeもやってみました。


> HTML内で背景画像としてSWFを表示したいのか、
> SWF内で背景画像を繰り返し表示したいのか、最低でも、このあたりを明確にすべきでしょう。

SWF内で背景画像を繰り返すというのは全く関係ありません。

「HTML内で背景画像としてSWFを表示したい」
というのが該当すると思います。

デザイン上、ブラウザで表示されたときに、ブラウザの横幅よりも大きめにFlashエリアをつくっておきたいのです。左右がこの先まだある、という見え方をさせたいので。

そうしたとき、CSSで背景画像を記述する要領であれば、
全てを包含する一番外堀のDIVタグに背景画像を仕込み、それをwidth: 100%にして、かつセンター合わせにしておけば、
jpegや、gifなどの静止画像ならばOKです。

しかし、画像部分が.swfとなるとどうすれば希望のことが叶うか方法を知りませんで投稿しました。

画像で示せないと文章だけだと伝わっているのかわかりませんのでご不明な点はまたご質問いただけると助かります。
お手数お掛けして申し訳ないですが宜しくお願いします。
ひろゆき
Åê¹ÆNo.48293
投稿日時: 2011-11-21 16:53
ちょんまげら
居住地: 東京砂漠
投稿: 4403
使用環境:
10.8.5

Flash Professional CS4/CS6/CC

Safari 6.1
Re: CSSの背景画像を.swfにするには?
SWFを繰り返し画像のように使いたいということでしょうか?
であれば、無理です。

SWFは画像ではなくSWFなので、画像と同じように扱うことには限界があります。

また、なぜ、画像ではなくSWFにしたいのかについても、説明すべきでしょう。

引用:
SWF内で背景画像を繰り返すというのは全く関係ありません

本当ですか?
これができないと実現できないことをおやりになろうとしているようにも思えますが。


----------------
質問する際は、回答者に具体的な情報を与えてください。

epiphone
Åê¹ÆNo.48297
投稿日時: 2011-11-22 14:25
新米
居住地:
投稿: 8
使用環境:
Windows7、Adobe Master Collection CS5
Re: CSSの背景画像を.swfにするには?
ブラウザをめいっぱい広げてもデザインが左右途切れるくらいに横幅が長いswfでヘッダーデザインができており、
その上に重なるようにグローバルナビゲーション(非Flash。liタグで記述されている)が表示されます。
重なるのはswfのかなり下の部分です。重なってもswfアニメーションを見せるのに支障が無い位置にします。



> なぜ画像ではなくswfにしたいのか?

静止した絵ではなく、動く絵にしたいからです。
小さな人型キャラクターがswfエリアであちこち動いている様子を作ります。
Flashムービーとはまさにこういうことをおこなうツールだと理解しており、逆にこれ以外のことが何かできるのでしょうか?
当方は初心者だと思っていただいて結構です。


なお、静止画像をCSSでbackgroundで記述して狙いを達成するように、swfでも何らかの方法で同じことがおこないたいということです。

ご不明な点は何なりとご質問ください。
どう書けば伝わるのかわからないでおります。
また、ひろゆき様のご質問や要求の意味自体がわからないところがあります。
そういった初心者のようなものですので、もしお付き合い頂けるようでしたら引き続き宜しくお願いします。
当方、Flash5の時代にActionScript以外の部分において手動でWebサイトのホームのFlashを少々ムービー仕立てでつくっていた程度の知識・技術なき者です。
知識が乏しい者は対応無理、とういことでしたらどうぞご遠慮なく放置してください。
他の方の投稿でも気長に待ちつつ、ネットで探しまくりつつ、本屋に立ち読みしつつ、やってみます
FlaHoop
Åê¹ÆNo.48298
投稿日時: 2011-11-22 15:04
新米
居住地: japan
投稿: 3
使用環境:
MacOS 10.7.1, Flash CS3-5
Re: CSSの背景画像を.swfにするには?
画像をFlashの中央に配置して、Flash自体の幅が常に100%になるように作ればいいんじゃないかな?
あとは、幅が想定以上(1430px?)になったとき、両端をバッサリ切るのか、うまいこと処理(画像を繰り返すとか、フェードアウトするとか…etc)するかはお好みで。

ヘッダーのFlash作るより、Flashの上にHTMLの要素乗っけるのがめんどくさい気がする。


----------------
あんまりくわしくないよ

TJFORD
Åê¹ÆNo.48299
投稿日時: 2011-11-22 16:40
半人前
居住地: Tokyo
投稿: 42
使用環境:
:Flash CS3
Re: CSSの背景画像を.swfにするには?
ひとつの案としてですがCSSとFlash両方で実現する方法もあるのではないでしょうか?
つまり背景はCSSでそのまま使い、その上にflashを乗せる感じです。もちろん画面端から端まで使うアニメーションは出来ませんがswfのサイズ内で収まるようなアニメーションであれば実現できるかと。
コマツ
Åê¹ÆNo.48303
投稿日時: 2011-11-22 17:38
職人
居住地: 東京都葛飾区
投稿: 356
使用環境:
windows7
CS5.5 CS6
Re: CSSの背景画像をFlashにするには?
epiphone さん、こんにちは。

私も、ひろゆきさんが書かれているように、最終的な形が見えませんので、少し整理させてください。


引用:

制作したサイトで、ヘッダーに背景画像として大きなイメージを使用しているのですが、それをFlashに差し替えたいです。
ところがこの大きなjpeg画像、CSSで背景画像として表示させており、CSSの背景画像をFlashに記述変更したところで表示は不可能ですよね。


epiphone さんは、CSSの背景をFlashの表示に変えることは不可能と書かれています。私も、CSSでswfを背景画像として設定できない仕様だと思っていますので、不可能だと思います。

ということは、代替手段を聞きたいということになると思うのです。

その場合、CSSの画像でできていること(繰り返し表示は必要ないんでしたっけ?)と、今回swfでどこまで表現されたいのかを明確しないと、いくつかの手段が出てくるように思います。
(epiphone さんもどこまでできるのかわからないので、説明ができないかもしれませんが)

CSSのbackgroundで表示できない以上、FlashとHTMLの要素を重ねるということを考えます。
swfをdivなどのブロック要素に設定して、positionプロパティで重ねるということです。(この場合swfが一番手前に見える問題がクリアできない場合はFlashを表示させるタグ内で使用する、「wmode」をtransparentにする必要があります


html,body,swfのボックス,swfを背景として上に表示したいボックス、それぞれCSSで100%にすれば、それぞれのボックスでセンタリングするなりすれば良いように感じます。

後は、swfが自動的に引き伸ばされてしまうのを避けたい場合は、htmlかactionscritなどで設定する必要があるように思います。



どうでしょう?
少し説明の助けになるでしょうか?

完成イメージに近いレイアウトなどのサイトなどのリンクを貼っていただいくのもイメージを説明するのに役に立つかと思いますよ。

epiphone
Åê¹ÆNo.48305
投稿日時: 2011-11-22 18:09
新米
居住地:
投稿: 8
使用環境:
Windows7、Adobe Master Collection CS5
Re: CSSの背景画像をFlashにするには?
みなさま、助けてくれてありがとうございます
会社から帰って投稿します。ホントにありがとうございます
epiphone
Åê¹ÆNo.48311
投稿日時: 2011-11-24 8:42
新米
居住地:
投稿: 8
使用環境:
Windows7、Adobe Master Collection CS5
Re: CSSの背景画像をFlashにするには?
komatsu様、アドバイスを読んでおりますと、何らご想像をお間違えではないように思えております。

センター合わせをしてもswfのサイズが勝手にブラウザの横幅に併せて縮小されないこと、つまり左右1500ピクセルで作成していれば、そのまま1500ピクセルのままで表示されないといけないこと。
※これは忘れていましたが以前テストしているときにこれに遭遇しました。

swfの上にhtmlである横長のグローバルナビゲーション画像エリアが表示できないといけないこと、

これらが課題と思っております。

昨日は急な家族の看病で作業が止まってしまいましたが、近日中に実際試していこうと思っておりますが、

> 後は、swfが自動的に引き伸ばされてしまうのを避けたい場合は、htmlかactionscritなどで設定する必要があるように思います。

自分の考えられる範囲でやる場合にもこれがテーマでした。
これの回避策は具体的にどのようにすればよいのでしょうか?
勝手にブラウザの表示横幅に勝手に縮小されてしまうのです。

不明点あらば何でもお尋ねください。
本当にありがとうございます。宜しくお願い致します。
(1) 2 »
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を
 
Copyright (C) 2003 FLASH-japan. All rights reserved.
Powered by Xoops