- ベストアンサー
画面サイズに合わせて背景の写真サイズを変えたいです。※FLASHじゃありません。
はじめまして。 現在、HTMLやCSSを勉強中のものです。 以下のサイトはFLASHで作成されており、一定の小さな画面サイズまでは自動で背景の画像が縮小される仕組みになっています。 http://www.diesel.co.jp/site.html 私19インチを一つしか持っていないので、よくわからないのですが、逆に画面サイズが大きくなる分にはこれだとどこまでも拡大されるのでしょうか? 今回、FLASHを使用しないで、背景に1枚絵の写真を使いホームページを作ろうかと考えています。 HTMLとCSSのみでこのような機能を持たせることは可能でしょうか? もし可能だとして、HTMLとCSSのみでこのような機能を持たせることにデメリットなどはございますでしょうか? どうかよろしくお願い申し上げます。
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<html> <img src="photo.jpg" style="position:absolute; top:0px;left:0px;" id="b"> <div style="position:absolute; top:0px;left:0px;"> abcabcabcabcabcabcabcabcabcabcabcabcabc<br> ここに適当に書いておくれ!<br> Javascriptを使うけど短いからなんとかなるでしょ!<br> 画像の名前はphoto.jpgを適当にかえて!<br> </div> <script> window.onresize = i; window.onload =i; function i(){ o=document.getElementById('b'); o.style.width = document.body.clientWidth; o.style.height = document.body.clientHeight; } </script>
その他の回答 (3)
- goldfox
- ベストアンサー率49% (123/249)
背景画像(background)を拡大縮小するのはできません。 flashやimgでページ上に配置したものなら可能です。 これについては他の方が答えています。 >こちらなんかは背景になっていて、画像を保存してみたところ、横は1600のようなのですが、永遠と拡大されるとどうなるのでしょうか? 舟のある海の画像ですか? 背景で設定されていますが、no-repeat center topで「繰り返さない、左右中央配置、上配置」を指定されていますので、横幅1600px以上の表示領域では、当然左右に背景画像のない状態になります。 >背景に1枚絵の写真を使い 上下左右ギリギリまで絵が付いているタイプは、サイズ次第とは思いますが、基本的に背景には向かないと思います。 java≠JavaScript インドシナをインドといっているようなものですので、気をつけたほうがいいです。
お礼
ありがとうございました。 もう一度勉強してみます。 本当にありがとうございました。
- DrFell
- ベストアンサー率55% (305/551)
cssとhtmlでもできます。タグやデメリットものっています。 http://www.tagindex.com/kakolog/q3bbs/201/350.html cssだと簡単にいうと、背景でななくimgで表示させ本文の下に配置して重ねる方法です。z-indexかpositionかで……。実際は多分デメリットの方が大きいとは思いますが、ターゲットが絞れるなら使えるかもしれません。
お礼
ありがとうございます。 同じような質問をされている方がいらっしゃったのですね・・・ ちなみになんですが・・・ http://www.edenviaggi.it/ こちらなんかは背景になっていて、画像を保存してみたところ、横は1600のようなのですが、永遠と拡大されるとどうなるのでしょうか? こちらもjavaだったりflashだったりするのでしょうか? お手数をおかけいたしますが、どうかよろしくお願いいたします。
補足
すみません・・・何度も。 そもそも下の回答に上げたようなサイトをを作る場合はどのようにして作ればいいのでしょうか? 今まではwrapで大きい枠を作ってその中にdivで枠を作ってレイアウトしてたのですが、下のように真ん中に枠を横切るような背景を設定するにはどのようにすればいいのでしょうか? よくよく考えるとそこからわからない状態でした・・・ もしご存知の方はどうかよろしくお願い申し上げます。
- marie_blue
- ベストアンサー率57% (22/38)
HTMLとCSSのみでは無理だと思います。 JavaScriptならウィンドウサイズを取得して、それに対するアクションという形で動的な画像リサイズのソースは出来ると思います。 背景画像で出来るかどうかはちょっとわかりませんが。
お礼
ありがとうございます。 javaでも背景ができると嬉しいのですが・・・ もう少しいろいろ勉強してみます。 本当にありがとうございました。
お礼
ありがとうございます。 javaはまだまだ勉強不足でして・・・ 一度試してみます。 本当にありがとうございました。