background-color random in the div without repeating the same color twice consecutively

Question

background-color random in the div without repeating the same color twice consecutively

Navigation

#1 by (4 votes)
#2 by (2 votes)

2

I want to create a sequence of DIV , but I want every DIV to have in its background-color a random color previously known as black, yellow and green, but I do not want these colors to repeat one after another.

Type: yellow > > yellow > > black > > green > > black

I want something like this to happen: yellow > > black > > yellow > > green > > black

I currently use this code to generate random colors for background-color , but this code repeats colors one after another, since the random color is generated on the refresh of the page.

<?php
$cor = array();
$cor[1] = "#CFF";
$cor[2] = "#9FF";
$cor[3] = "#600";
$cor[4] = "#FF0";
$cor[5] = "#C69";
$cor[6] = "#0F0";
$contador = count($cor);
$aleatorio = rand(1,$contador);
?>

<style>
div{margin-left:15px; width:100px; height:100px; float:left}
</style>

<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>
<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>
<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>
<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>
<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>
<div style="background-color:<?php echo $cor[$aleatorio] ?>"></div>

In case my problem is not repeat the colors, but repeat the same color one after another. So I cited the above yellow > > > > > > > > > green & quot; black & quot; pattern, in which case equal colors repeat one after another. The colors may even repeat INVERTER times, but I do not want them to repeat one after another, I want something like: :: Yellow > > black > > Yellow > > black

php css

asked by anonymous 25.09.2014 / 19:58

2 answers

2

You can solve it in a simpler way:

<?php
$cor = array();
$cor[1] = "#CFF";
$cor[2] = "#9FF";
$cor[3] = "#600";
$cor[4] = "#FF0";
$cor[5] = "#C69";
$cor[6] = "#0F0";

//altera de forma aleatória os membros da array.
shuffle($cor);
?>

<style>
div{margin-left:15px; width:100px; height:100px; float:left}
</style>

<div style="background-color:<?php echo $cor[0] ?>"></div>
<div style="background-color:<?php echo $cor[1] ?>"></div>
<div style="background-color:<?php echo $cor[2] ?>"></div>
<div style="background-color:<?php echo $cor[3] ?>"></div>
<div style="background-color:<?php echo $cor[4] ?>"></div>
<div style="background-color:<?php echo $cor[5] ?>"></div>

25.09.2014 / 20:58

Table formats? Command to display a limit of records in a table

score 4 · Accepted Answer

If you want to switch colors between% s and% s, it's easier to create a function:

<?php
   function corAleatoria() {
      static $corAnterior = 0;
      static $cor = array( '#CFF', '#9FF', '#600', '#FF0', '#C69', '#0F0' );

      $aleatorio = rand( $corAnterior?1:0, count( $cor ) - 1 );
      if( $aleatorio >= $corAnterior ) $aleatorio++;
      $corAnterior = $aleatorio;
      return $cor[$aleatorio - 1];
   }
?>

<style>
   div{margin-left:15px; width:100px; height:100px; float:left}
</style>

<div style="background-color: <?php echo corAleatoria(); ?>"></div>
<div style="background-color: <?php echo corAleatoria(); ?>"></div>
<div style="background-color: <?php echo corAleatoria(); ?>"></div>
<div style="background-color: <?php echo corAleatoria(); ?>"></div>
<div style="background-color: <?php echo corAleatoria(); ?>"></div>
<div style="background-color: <?php echo corAleatoria(); ?>"></div>

So, every time you call div , a string with the color that is drawn and not repeated will be returned.

If you are going to generate% s in loop in the future, you can simplify the process like this:

<style>
   div{margin-left:15px; width:100px; height:100px; float:left}
</style>

<?php
   $corAnterior = 0;
   $cor = array( '#CFF', '#9FF', '#600', '#FF0', '#C69', '#0F0' );
   $max = count( $cor ) - 1;

   for( $i = 0; $i < 10; $i++ ) {
      $aleatorio = rand( $corAnterior?1:0, $max );
      if( $aleatorio >= $corAnterior ) $aleatorio++;
      $corAnterior = $aleatorio;

      echo '<div style="background-color: '.$cor[$aleatorio - 1].'"></div>';
   }
?>