HP作成について。背景を右上に固定しつつ、ランダムに画像を表示させる方法。画面をスクロールしたとき動かしたくないです。イメージとしては、<style type=”text/css”><!--body{ background-image:url(背景画像のURL); background-attachment:fixed; background-repeat:no-repeat; background-position:right top;}--></style>こんな感じで、画像がランダム表示。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2003/10/21 00:56:36
  • 終了:--

回答(5件)

id:masaomix No.1

masaomix回答回数1023ベストアンサー獲得回数12003/10/21 08:27:22

ポイント10pt

http://www.1point.jp/~info-bbs/cgi-bin/officecats/bbs01/index.ht...

banned interdit verboden prohibido vietato proibido

またまたURLはダミーです。

ごめんなさい。背景は右上に固定でノーリピートでしたね(^-^;

2の回答のスタイルシートのところは間違ってます(^-^;

CSSはご質問者の意図したものに変えてください。

ごめんなさい。訂正してお詫びします(汗

id:inokuni No.2

いのくに回答回数1343ベストアンサー獲得回数212003/10/21 01:22:25

ポイント10pt

http://1up-life.com/1upweb/tips/random2.html

tips ランダムスクリプト2

JavaScript を使ってみてはどうでしょうか?

body タグに bgproperties=fixed を記述すると、背景画像が固定されます。

このページがズバリな回答かも。

id:masaomix No.3

masaomix回答回数1023ベストアンサー獲得回数12003/10/21 01:30:21

ポイント10pt

http://www.officecats.net/

動物愛護同人「ねこの事務所」

URLはダミー。私のサイトです(^-^;

さて、ご質問のような背景のランダム入れ替えは

スタイルシートではちょっと無理なんです。

スタイルシートは見栄えに関する指定をするだけで、

計算したりする機能はありません。

こういう用途にはjavascriptを使うのが簡単です。

たとえばこんな感じ。

<script Language=”JavaScript”>

var n = Math.floor(Math.random()*4) ;

document.write(”<BODY bgcolor=’#ffffff’ background=’wp”+n+”.gif’>”);

</script>

< と > は全角で書いてありますが、実際には半角にしてくださいね。

Math.floor(Math.random()*4)は、0,1,2,3の整数の乱数を発生させる部分です。

そして、

document.write(”<BODY bgcolor=’#ffffff’ background=’wp”+n+”.gif’>”);

で n に 0〜3 を代入して、

wp0.gif、wp1.gif、wp2.gif、wp3.gif、という背景画像を

ランダムに表示させていきます。

ですから、random()*4 の4を変えてやれば、

好きな数の背景を切り替えて表示させることができます。

実際にはこんな感じでページに貼り込んでください。

スタイルシートは背景の固定用です。

<HTML>

<HEAD>

<TITLE>タイトル</TITLE>

<STYLE type=”text/css”>

<!--

BODY { background: repeat fixed; }

-->

</STYLE>

</HEAD>

<BODY>

<SCRIPT Language=”JavaScript”>

<!--

var n = Math.floor(Math.random()*4) ;

document.write(”<BODY text=’#000000’ link=’#0000ff’ vlink=’#6600cc’ alink=’#ff0000’ bgcolor=’#ffffff’ background=’wp”+n+”.gif’>”);

//-->

</SCRIPT>

</BODY>

</HTML>

これで、HTMLファイルと同じフォルダに背景画像

wp0.gif、wp1.gif、wp2.gif、wp3.gif を置けば出来上がりです。

やってみてください。

id:ricca No.4

ricca回答回数54ベストアンサー獲得回数02003/10/21 01:47:03

ポイント40pt

http://www.b-ev.net/

ディレクトリー型リンク集 エレクトロンボルト

このサイトを作ってるものです。

ここのピンクのボタン(b-ev?)のカンパニーコンセプトにあるjavascriptを流用してみては。

背景を右上に固定するとすると、具体的には、

<script language=”JavaScript”>

<!--

Bgs=new Array(14);

Bgs[1]=”conseptbg01”;

Bgs[2]=”conseptbg02”;

Bgs[3]=”conseptbg03”;

Bgs[4]=”conseptbg04”;

Bgs[5]=”conseptbg05”;

Bgs[6]=”conseptbg06”;

Bgs[7]=”conseptbg07”;

Bgs[8]=”conseptbg08”;

Bgs[9]=”conseptbg09”;

Bgs[10]=”conseptbg10”;

Bgs[11]=”conseptbg11”;

Bgs[12]=”conseptbg12”;

Bgs[13]=”conseptbg13”;

Bgs[14]=”conseptbg14”;

var iValue,rNumber;

iValue=Math.random()*14;

rNumber=Math.ceil(iValue);

if(rNumber==0) rNumber++;

document.write(”<style type=’text/css’>”);

document.write(”BODY { background-image: url(’img/”+Bgs[rNumber]+”.gif’); background-attachment: fixed; background-repeat: no-repeat;

background-position:right top;}”);

document.write(”</style>”);

//-->

</script>

こんな感じです。

id:harem69

この形式が理想です。これって、左右上下の位置は指定できるんですか?いわしで教えていただけると嬉しいです・・・図々しいですね。ありがとうございましたv

2003/10/24 02:21:23

質問者が未読の回答一覧

 回答者回答受取ベストアンサー回答時間
1 miwawp 32 25 0 2003-10-21 09:04:41

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません