Page 805 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 通常モードに戻る ┃ INDEX ┃ ≪前へ │ 次へ≫ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ ▼ランダムな背景。 るな 04/9/25(土) 2:34 ┣Re:ランダムな背景。 むむりく 04/9/25(土) 4:56 ┗Re:ランダムな背景。 Pid 04/9/25(土) 6:26 ┗Re:ランダムな背景。 るな 04/9/26(日) 23:07 ─────────────────────────────────────── ■題名 : ランダムな背景。 ■名前 : るな ■日付 : 04/9/25(土) 2:34 -------------------------------------------------------------------------
はじめましてこんばんんわ。 今サイト制作の途中なのですが、どうしても解決しないことがあり質問させて頂きます。 背景をページ表示の度に変える。という作業をしているのですが、 <SCRIPT LANGUAGE="JavaScript"> <!-- back=new Array(2); back[0]="images/back07.gif"; back[1]="images/back08.gif"; MyBack=Math.floor(5*Math.random()); document.write("<body background='"+back[MyBack]+"'>"); //--> </SCRIPT> というタグを使用しています。 例えば1枚目を右下。二枚目を中央。と分けて配置するにはどうしたらよいのでしょうか?? 説明下手ですみません; ご返答のほうよろしくお願いします!! |
▼るなさん: >はじめましてこんばんんわ。 こんばんは。まずは落ち着きましょう(+д+) >今サイト制作の途中なのですが、どうしても解決しないことがあり質問させて頂きます。 >背景をページ表示の度に変える。という作業をしているのですが、 ><SCRIPT LANGUAGE="JavaScript"> ><!-- >back=new Array(2); >back[0]="images/back07.gif"; >back[1]="images/back08.gif"; >MyBack=Math.floor(5*Math.random()); >document.write("<body background='"+back[MyBack]+"'>"); >//--> ></SCRIPT> >というタグを使用しています。 「タグ」と言われていることから想像するに、 JavaScript に関しては「あまり…」という感じでしょうか? そもそもこれでは、画像がでないときもあるのでは… >例えば1枚目を右下。二枚目を中央。と分けて配置するにはどうしたらよいのでしょうか?? ということで、サンプルを。 # indent が全角になるので、左寄せにしてます。 <style type="text/css"><!-- body { background: #fff url("images/back07.gif") no-repeat right bottom; } --></style> <script type="text/javascript"> <!-- window.onload = function() { if (!document.getElementsByTagName) return; var img = ['images/back07.gif','images/back08.gif'], // 画像へのパス(追加可能) pos = ['right bottom','50% 50%'], // 表示する場所(上と合うように) n = Math.floor(Math.random() * img.length), x = document.getElementsByTagName('body')[0]; x.style.backgroundImage = 'url(' + img[n] + ')'; x.style.backgroundPosition = pos[n]; } //--> </script> |
>はじめましてこんばんんわ。 ども,お早うございますです。 >というタグを使用しています。 それは「タグ」ではないのであります。 >例えば1枚目を右下。二枚目を中央。と分けて配置するにはどうしたらよいのでしょうか?? ところで,背景画像の位置を指定する場合,普通はどうするんでしたっけ?…以下のスクリプトを使うにはその知識が前提になります。 <script type="text/javascript"> function changeBG() { // 画像と位置の指定。画像数は自由。 var x = [ [ 'images/back06.gif', '20% 10%' ], [ 'images/back07.gif', 'right bottom' ], [ 'images/back08.gif', 'center center' ] ]; // 以下に手を加える必要はありません var y = x[ Math.floor(Math.random() * x.length) ]; var z = '<style type="text/css">' + 'body {' + ' background-image: url("' + y[0] + '");' + ' background-position: ' + y[1] + ';' + ' background-repeat: no-repeat;' + '}' + '<\/style>'; document.write(z); } changeBG(); </script> むむりくさんの方がエレガントですね (^^;)。まあでも一応,古いブラウザでも動作します。 ※なお,るなさんのスクリプトでは,JavaScript 機能がオフの場合に <body> が無くなってしまいます。 |
むむりさん、pidさんご返答ありがとうございます。 今までサイトを何となくで作ってきてしまっていたので、まだまだ勉強がたりないなと思いました。 サンプルまで頂いてありがとうございました。 これからもっと色々勉強してサイト制作頑張りたいと思います。 本当にありがとうございました。 |