
よろしくお願いします。
下記のページを参考に、
http://javascript.eweb-design.com/0802_ici.html
背景画像を一定時間で切り替えることはできたのですが、
画像が切り替わる時に、ゆっくりフェードしながら切り替わるということは可能でしょうか?
同じような挙動であれば、他のスクリプトやjQueryでも問題ありません。
実現させたい内容としては、
・bodyの背景画像が切り替わる(div等ではなく)
・フェードで切り替わる
になります。
ご存知の方おられましたら、ご教授くださいませ。
どうぞよろしくお願いいたします。
A 回答 (4件)
- 最新から表示
- 回答順に表示
No.4
- 回答日時:
ANo1です。
>bodyの背景にこだわっているので~~
ばかばかしくて思いつかなかった方法がありました。
透明化の過程をそれぞれ画像で用意しておいて、順に背景を変えていく方法。
これなら完全に背景の操作だけでご質問の内容が実現できますし、質問者様がご存知の背景を取り替えることのみで実現可能となります。
ただし、事前に画像を読込んでおく必要がでてくるでしょう。
方法論だけですので、上記のような方法をやろうとする人はいないでしょう。(考えもしないでしょう)
その意味では、No1の方法もほとんど採用されないと思います。
スクリプトを用いることで動的に画面表示の状態を変えることが可能になりますが、その一瞬々々の状態をとって見れば、HTMLとCSSで表示できないものはありません。
逆にいうと、HTMLとCSSで表示できない状態は、スクリプトを利用しても表示できません。
bodyの背景を半透明にする方法があれば、直接に背景をフェードさせることが可能になるかと思います。
No.3
- 回答日時:
とりあえずそのサイトは古すぎるといっておきます。
個人用途なら問題ありませんが、公開するのであれば
FireFox(Gecko系)やChrome(webkit系)も考慮しないといけません。
IEも7ぐらいから標準準処に近づいてきていますが、IE独自仕様のものを使用しても他のブラウザでは使えません。
css3に関しても各ブラウザによって実装度は違います。
出来るけど、質問者様のレベル的に面倒そうだという結論でスルーされてるのではないでしょうか。
というのはまあおいといて。bodyの背景画像にこだわらないのであれば
jQueryとjQueryを利用したプラグインを利用すれば簡単に実装できます。
http://matome.naver.jp/odai/2132859679359719601
ご回答ありがとうございます。
bodyの背景にこだわっているので、お教えいただいたjQueryだと難しそうです・・・。
>出来るけど、質問者様のレベル的に面倒そうだという結論でスルーされてるのではないでしょうか。
別の質問になってしまい、恐縮ですが、
今回のこの質問でそうご判断されたのでしょうか?
もしくはこれ迄の質問をご覧になられての判断でしょうか?
教えてgooの仕組みがいまいちわからず・・・。
No.1
- 回答日時:
何度も同じ質問をなさっているようですが…
『bodyの背景画像をフェードで切替える(divではなく)』という明確な条件付きなので、回答が付かないのではないかと…
調べてはいませんが、HTML5でも背景画像の透明度指定はできなかったような気がしますが。
(できるのでしたっけ? それなら、HTML5対応のブラウザなら可能かも)
ご指定の条件をかいくぐってやるならば…
1)body直下にz-indexを-999などで画面サイズのマスクのボックス(divなど)を生成する。
2)ボックスの背景色をbodyの背景色で塗りつぶしておいて、フェードで表示。
(背景がフェードアウトするのと同じように見えるはず)
3)bodyの背景を切替える
(切替わったことは見えない)
4)ボックスをフェードアウト
(新しい背景がフェードインするように見える)
5)生成したボックスを削除
といった手順で、見かけ上は似たことができそうな気がしますが、普通に画像を切替えながらフェードイン/アウトする方が発想としてノーマルな気がします。
また、実質的には、bodyの背景をフェードイン/アウトさせているわけではないので、やっぱり回答にはなりませんね。
ご回答ありがとうございます。
>何度も同じ質問をなさっているようですが…
一部条件を削除して投稿し直したつもりだったのですが、
(一応前の質問は削除しました)
「何度も同じ質問をしている」様に見えてしまうのでしょうか・・?
てっきり埋もれて誰も見ていないと思っていたのですが、
教えてgooの仕組みがいまいちわからず・・。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
1枚の画像をクリックすると複数...
-
iframe内のリンク文字のマウス...
-
透過pngの透明部分以外をクリッ...
-
プルダウンの位置がwin/macでず...
-
innerHTMLで、表示すると、一部...
-
画像をクリックしてその地点の...
-
画像の重なりの順序を代える方...
-
textareaに画像を表示したい
-
どの<li><a> が押されたか判別...
-
MAX関数を使ってからLEFT JOIN...
-
eclipseでcssを使うためには?
-
JavaScript - 月ごとに画像変化
-
画面が真っ白になるのはどうして?
-
floatさせたdivタグを折り返さ...
-
jspでcssが読み込めない
-
jqueryを使ってポップアップを...
-
<li></li>の数を制限
-
JAVAで画像をボタンで切り替え...
-
タブ切り替えの初期表示について
-
jQueryでクリックされた要素のi...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
1枚の画像をクリックすると複数...
-
画像の重なりの順序を代える方...
-
textareaに画像を表示したい
-
Gifアニメ、最後のコマに行った...
-
透過pngの透明部分以外をクリッ...
-
1枚の画像をクリックして複数の...
-
ステータスバーについて
-
JavaScript スライドの画像にリ...
-
マウス追従スクリプトについて
-
画面の表示位置を指定させて表...
-
Javascriptで指定した日付と時...
-
プルダウンの位置がwin/macでず...
-
jQueryで特定のURLの時のみ表示
-
オンマウスで、画像切り替え+...
-
バナー広告のように表示させた...
-
ランダム表示に加えwidthをブラ...
-
JavaScriptとチェックボックス...
-
ホォルダの読む込み
-
jQuery bxSlider 画像に変更
-
画像にロールオーバーするとメ...
おすすめ情報