I am developing a web page and I have the following setup: <div class="employee_container"> <div id="group1"></div> <div id="group2"></div> <div id="group3"></div> </div> Code (markup): each time my page is refreshed I want to radnomize groups 1 thru 3. Maybe radomize isn't the correct method but something like randomize. If you land on the page and group1 is present and then you refresh the page can you force group2 to the surface or force group3? I know with randomize you can refresh the page and group1 might appear all 3 times. I really am looking for something that will rotate the groups.
if using php, simplest way would probably be: <div class="employee_container"> <div id="group<?=rand(1,3)?>"></div> </div> Code (markup):
Dade72 thanks anyway but I am not using php. I need a javascript solution. I have to think there would be a way to randomize the groups based on the ID.
I hunted around on google and found this this script and it was designed to change the order at a set interval. I don't want that to happen so I took the rotatecontent() out of the set Interval and placed it by itself. I also don't like that it is loading some css content. Can I take the .dyncontent and put it on my existing stylesheet? The next problem is that it doesn't seem to rotate the content on refresh of the page. How do I make this work? Maybe there is a simpler approach? <script type="text/javascript"> if (document.all || document.getElementById){ //if IE4 or NS6+ document.write('<style type="text/css">\n') document.write('.dyncontent{display: none;}\n') document.write('</style>') } var curcontentindex=0 var messages=new Array() function getElementByClass(classname){ var inc=0 var alltags=document.all? document.all : document.getElementsByTagName("*") for (i=0; i<alltags.length; i++){ if (alltags[i].className==classname) messages[inc++]=alltags[i] } } function rotatecontent(){ //get current message index (to show it): curcontentindex=(curcontentindex<messages.length-1)? curcontentindex+1 : 0 //get previous message index (to hide it): prevcontentindex=(curcontentindex==0)? messages.length-1 : curcontentindex-1 messages[prevcontentindex].style.display="none" //hide previous message messages[curcontentindex].style.display="block" //show current message } window.onload=function(){ if (document.all || document.getElementById){ getElementByClass("dyncontent") rotatecontent(); //setInterval("rotatecontent()", 2000) } } </script> <div class="employee_container"> <div id="group1" class="dyncontent" style="display: block"></div> <div id="group2" class="dyncontent"></div> <div id="group3" class="dyncontent"></div> </div> Code (markup):
I'm sorry I misunderstood, perhaps this can help: http://www.webmaster-talk.com/javascript-forum/56533-how-randomize-table-rows-never-attempted.html
Thanks for the link, but that code looks like it is set up to use table rows which I don't have. Are you suggesting it could be changed and used for div tags?