今さらですがランダム表示スクリプト

★ 今回は今さらですがランダム表示のＪａｖａＳｃｒｉｐｔです。

ごく簡単なＪａｖａＳｃｒｉｐｔですが、いろいろな場面でとても使い道があります。

これは、例文を出しながら説明します。

■ランダム表示の項目
まず、下の内容を「adsfile.js」という内容で保存しておく。
「adsfile」というファイル名は自分で他の名前を付けてもいいけど、
その場合には下のスクリプトファイルをロードするときのファイル名も変更すること。）

AD = new Array();
AD[1] ='ここに表示させる内容を書く';
AD[2] ='ここに表示させる内容を書く';

番号を増やして行けばいくつでも続けられるが１００〜１５０くらいが適当だと思う。
あまり多いと読込で表示が遅くなる。

ＡＤという変数名は自分で適当に付けてもいいが、
その場合には番号前についているＡＤも変更したものに変えること、
それと下の表示部分のスクリプトのＡＤも変更すること。

下に挙げる『表示する場所に書くＪａｖａＳｃｒｉｐｔ』より必ず前にロードすること
<script type="text/javascript" src="<%url>file/adsfile.js"></script>


■表示する場所に書くＪａｖａＳｃｒｉｐｔ

<script language="JavaScript">
<!--
Ln = AD.length;　/*ランダム表示の項目の長さ*/
r = 5;　/*何項目表示させるか？*/
a = Math.floor(Math.random( )*(Ln-r));
document.write('<table cellpadding=5>');
for(i=0;i<r;i++){
document.write('<tr><td>');
document.write(AD[a+i+1]);
document.write('</td></tr>');
};
document.write('</table>');　/*テーブルで書き出し*/
//-->
</script>

■　説明
例えばＡＤが１００項目あったとすると
　Ln = AD.length　= 100

５項目表示させるとすると
　r = 5

Math.randomというのは、０から１未満のランダム数値を返す。
これに１００−５＝９５をかけると０から９５までの数値を返す。
Math.floorは計算結果を数値の繰り下げをして整数値にする。
　a = Math.floor(Math.random( )*(Ln-r))　で上記の条件の場合０から９５までの整数値が返ってきます。

１００項目のときの表示させる項目数の５を引いているのは、
　a = 100　になったときに１０１項目が無いために表示される項目が空白になってしまうのを防ぐためです。

あとは上から順に項目を書き出しているだけです。

<div style="width:150px">この間に先ほどのスクリプトを入れると１５０ｐｘになります。 当然数値を変えてやれば幅を変えることも可能です。</div>

スタイルシートも適用可能なので適当に色合いを変更することも可能です。
人気ブログランキング

ブログ内関連タグ : ＪａｖａＳｃｒｉｐｔ