a simple randomize code or rotate group code

Discussion in 'JavaScript' started by Navarone, Apr 10, 2008.

  1. #1
    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.
     
    Navarone, Apr 10, 2008 IP
  2. Dade72

    Dade72 Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    if using php, simplest way would probably be:
    
    <div class="employee_container">
          <div id="group<?=rand(1,3)?>"></div>
    </div>
    
    Code (markup):
     
    Dade72, Apr 10, 2008 IP
  3. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #3
    No, he/she wants to place all 3 divs randomly, but your code will put only one.
     
    ajsa52, Apr 10, 2008 IP
  4. Navarone

    Navarone Guest

    Messages:
    59
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    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.
     
    Navarone, Apr 11, 2008 IP
  5. Navarone

    Navarone Guest

    Messages:
    59
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    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):
     
    Navarone, Apr 11, 2008 IP
  6. Dade72

    Dade72 Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Dade72, Apr 11, 2008 IP
  7. Navarone

    Navarone Guest

    Messages:
    59
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    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?
     
    Navarone, Apr 11, 2008 IP
  8. Dade72

    Dade72 Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Yes, its the same thing, just start by setting the div tags in an array and use that to randomize
     
    Dade72, Apr 11, 2008 IP