javascriptがあまり分からなくてもランダムに画像や要素ローテーション表示する方法
PR
PHP側でもランダムにして表示することも可能ですが、動的なページをキャッシュして静的なページにしている場合などには、PHPは動かないので出来ません
そんな時にjavascriptをHTMLに組み込んでおけばキャッシュの有無にかかわらず
ランダムな動作を実装することが出来ます
ランダムに一つ表示できるようになれば何かと便利です。
javascriptを使ってランダムに一つ表示する方法
動作はDEMOページで確認して下さい
<script> <!-- youso = new Array(); // 表示させたいHTMLをそれぞれ入れてください、個数は自由に増やせますが[]内の数字が0から始まって連続するようにしてください youso[0] = '<a href="#Link1">Link1</a>'; youso[1] = '<a href="#Link2">Link2</a>'; youso[2] = '<a href="#Link3">Link3</a>'; youso[3] = '<a href="#Link4">Link5</a>'; youso[4] = '<a href="#Link5">Link5</a>'; youso[5] = '<a href="#Link6">Link6</a>'; n = Math.floor(Math.random()*youso.length); document.write(youso[n]); //--> </script> <noscript> //javascriptが無効の時に表示するもの <a href="#Link1">Link1</a> </noscript>
youso[0] ~ youso[5] までありますが好きな数だけ増やせます
= の後の内容を好きなHTMLに変えればそれが表示されるようになります
仕組みは yousoに配列としてHTMLを格納して
ランダムな数字を作り出して、そのランダムな数字を元に配列に格納されたものを呼び出して
document.writeで書き出しています
参考ページ
http://javascript.eweb-design.com/0804_ri.html
参考ページのコードをjavascriptに精通していなくても使いやすいように少し改良しました
PR
COMMENT