ページをロードするたびにコンテンツや写真の順番をランダムで表示
たまにページを更新するたびにコンテンツの順番が変わったり、表示されている写真の順番が変わったりするのを見かけますよね?
そういった事をする為には以下のScriptを記述すれば簡単に実装する事が出来ます!
//配列をシャッフル function shuffle(a){ var i = a.length; while(i){ var j = Math.floor(Math.random()*i); var t = a[--i]; a[i] = a[j]; a[j] = t; } return a; } $(document).ready(function() { //配列に格納したクラスをランダムに割り当てる var SfClass = [ "ランダムに割り当てたいクラス1", "ランダムに割り当てたいクラス2", "ランダムに割り当てたいクラス3", "ランダムに割り当てたいクラス4" ]; var Parent = $("クラスを割り当てる要素"); SfClsCnt = SfClass.length; shuffle(tbClass); itmp = 0; Parent.each(function(i, val) { $(this).addClass(SfClass[itmp]); if (itmp < SfClsCnt-1) { itmp++; }else{ itmp = 0; shuffle(SfClass); } }); });
これでページを読み込む(ロード)する度に指定した要素に用意したクラスがランダムに割り当てられます。
また、もっと簡単な記述もあると思います。
良ければ試してみて下さい。
Good bye