jQueryを利用することで簡単なコードですぐにランダム表示ができるようです。
利用方法
jQueryを利用していますので、もちろんあらかじめjQueryを読み込んでおきます。
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
JavaScript
<script language="JavaScript" type="text/javascript"> jQuery(function($) { $.fn.extend({ randomdisplay : function(num) { return this.each(function() { var chn = $(this).children().hide().length; for(var i = 0; i < num && i < chn; i++) { var r = parseInt(Math.random() * (chn - i)) + i; $(this).children().eq(r).show().prependTo($(this)); } }); } }); $(function(){ $("[randomdisplay]").each(function() { $(this).randomdisplay($(this).attr("randomdisplay")); }); }); }); </script>
HTML
randomdisplay=""
というパラメータを付けて、ランダムさせたい数を指定します。
<div class="row-fluid" randomdisplay="100"> <div class="span3">ランダム表示させたいブロックA</div> <div class="span3">ランダム表示させたいブロックB</div> <div class="span3">ランダム表示させたいブロックC</div> <div class="span3">ランダム表示させたいブロックD</div> <div class="span3">ランダム表示させたいブロックE</div> </div>