画面サイズに合わせて背景の写真サイズを変えたいです。※FLASHじゃありません。

解決済

質問者：BOTTEGA_V
質問日時：2008/02/14 14:41
回答数：4件

はじめまして。
現在、HTMLやCSSを勉強中のものです。

以下のサイトはFLASHで作成されており、一定の小さな画面サイズまでは自動で背景の画像が縮小される仕組みになっています。

http://www.diesel.co.jp/site.html

私19インチを一つしか持っていないので、よくわからないのですが、逆に画面サイズが大きくなる分にはこれだとどこまでも拡大されるのでしょうか？

今回、FLASHを使用しないで、背景に1枚絵の写真を使いホームページを作ろうかと考えています。
HTMLとCSSのみでこのような機能を持たせることは可能でしょうか？
もし可能だとして、HTMLとCSSのみでこのような機能を持たせることにデメリットなどはございますでしょうか？

どうかよろしくお願い申し上げます。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： _pipi_
回答日時：2008/02/14 16:43

<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>

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。

javaはまだまだ勉強不足でして・・・

一度試してみます。
本当にありがとうございました。

通報する

お礼日時：2008/02/14 17:44

No.4

回答者： goldfox
回答日時：2008/02/14 19:34

背景画像（background）を拡大縮小するのはできません。

flashやimgでページ上に配置したものなら可能です。
これについては他の方が答えています。

＞こちらなんかは背景になっていて、画像を保存してみたところ、横は1600のようなのですが、永遠と拡大されるとどうなるのでしょうか？
舟のある海の画像ですか？
背景で設定されていますが、no-repeat center topで「繰り返さない、左右中央配置、上配置」を指定されていますので、横幅1600px以上の表示領域では、当然左右に背景画像のない状態になります。

＞背景に1枚絵の写真を使い
上下左右ギリギリまで絵が付いているタイプは、サイズ次第とは思いますが、基本的に背景には向かないと思います。

java≠JavaScript
インドシナをインドといっているようなものですので、気をつけたほうがいいです。

- 0
- 件

通報する

この回答へのお礼

ありがとうございました。

もう一度勉強してみます。

本当にありがとうございました。

通報する

お礼日時：2008/02/14 21:23

No.3

回答者： DrFell
回答日時：2008/02/14 17:16

cssとhtmlでもできます。

タグやデメリットものっています。
http://www.tagindex.com/kakolog/q3bbs/201/350.html

ｃｓｓだと簡単にいうと、背景でななくimgで表示させ本文の下に配置して重ねる方法です。z-indexかpositionかで……。実際は多分デメリットの方が大きいとは思いますが、ターゲットが絞れるなら使えるかもしれません。

この回答への補足

すみません・・・何度も。

そもそも下の回答に上げたようなサイトをを作る場合はどのようにして作ればいいのでしょうか？
今まではwrapで大きい枠を作ってその中にdivで枠を作ってレイアウトしてたのですが、下のように真ん中に枠を横切るような背景を設定するにはどのようにすればいいのでしょうか？

よくよく考えるとそこからわからない状態でした・・・

もしご存知の方はどうかよろしくお願い申し上げます。

補足日時：2008/02/14 17:59

通報する

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
同じような質問をされている方がいらっしゃったのですね・・・

ちなみになんですが・・・

http://www.edenviaggi.it/
こちらなんかは背景になっていて、画像を保存してみたところ、横は1600のようなのですが、永遠と拡大されるとどうなるのでしょうか？
こちらもjavaだったりflashだったりするのでしょうか？

お手数をおかけいたしますが、どうかよろしくお願いいたします。

通報する

お礼日時：2008/02/14 17:51

No.1