Colorer la moitié d'une case

par **ferrierd** » 19 févr. 2013, 14:39

Bonjour,

Merci beaucoup pour vos réponses, je vais me pencher attentivement sur les exemples fournis

@+
David

par **sirakawa** » 17 févr. 2013, 23:26

Une piste très générale:

<html>
<style>
*.rouge
{
	background-color:red;
}
*.vert
{
	background-color:green;
}

</style>
</html>
<?PHP
$quart_journees = array();
$quart_journees[1]= "calme";
$quart_journees[2]= "occupe";
$quart_journees[3]= "calme";
$quart_journees[4]= "calme";
$quart_journees[5]= "occupe";
$quart_journees[6]= "occupe";
$quart_journees[7]= "calme";
$quart_journees[8]= "calme";
$quart_journees[9]= "calme";
$quart_journees[10]= "occupe";
$quart_journees[11]= "calme";
$quart_journees[12]= "calme";
$quart_journees[13]= "occupe";
$quart_journees[14]= "occupe";
$quart_journees[15]= "calme";
$quart_journees[16]= "calme";
$quart_journees[17]= "calme";
$quart_journees[18]= "calme";
$quart_journees[19]= "calme";
$quart_journees[20]= "occupe";
print_r($quart_journees);

$table = "<table>";
for ($i = 1; $i <=5; $i ++)
{
	$indice_q_init = 1 + (4*($i-1));
	$table .= "<tr>";
	for ($j = $indice_q_init; $j < $indice_q_init+4; $j++)
	{
print"<br>$j $quart_journees[$j]"	;
		$style_cell = $quart_journees[$j] == "calme"? "class='vert'": "class='rouge'";
		$table .= "<td $style_cell>rv</td>";
	}
	$table .= "</tr>";

	print "<br>$i $indice_q_init<br>";
}
	$table .= "</table>";
print "$table";
?>

par **niuxe** » 17 févr. 2013, 18:51

Salut,

On m'a déjà proposé une solution qui fonctionne très bien: mettre une image de fond dans ma celulle, donc image de fond avec deux couleurs, et j'ai donc une cellule avec deux couleurs pour chaque demi-journée.

+1

L'inconvénient de cette méthode est que si je souhaite mette en place pour l'utilisateur une gestion des couleurs des évenements, la solution ci-dessus est statique...

Pas du tout !
soltion 1.

<td class="demieJourneeGen demieJourneeSpec">2</td> <!-- l'ordre de déclaration des classes est important -->

.demieJourneeGen{background:url(chemin/red.png) /*etc.*/;}
.demieJourneeSpec{background:url(chemin/blue.png) /*etc.*/;}

Pour optimiser cette idée
solution 2

<td class="demieJourneeGen demieJourneeSpec">2</td> <!-- l'ordre de déclaration des classes est important -->

.demieJourneeGen{background:url(chemin/sprite-evenent-calendrier.png) 0 0 no-repeat transparent;}
.demieJourneeSpec{background-position:0 -150px;}

solution 3
en CSS3 :

<td class="demieJourneeSpec">2</td>

.demieJourneeSpec{background: linear-gradient(to bottom, #ff3236 0%,#ff3033 50%,#ffffff 51%,#ffffff 100%);} /*A decliner sur les autres browsers*/

par **ferrierd** » 17 févr. 2013, 10:27

Bonjour,
Débutant php, je souhiate savor s'il est possible de modifier la couleur d'une case, mais sur uniquement sur sa moitié.

L'idée est de pouvoir faire un calendrier avec une gestion des demi-journée, chaque couleur de demi-journée pouvant se rapporter à des évenements différents (réunion, formation,...)

On m'a déjà proposé une solution qui fonctionne très bien: mettre une image de fond dans ma celulle, donc image de fond avec deux couleurs, et j'ai donc une cellule avec deux couleurs pour chaque demi-journée.
L'inconvénient de cette méthode est que si je souhaite mette en place pour l'utilisateur une gestion des couleurs des évenements, la solution ci-dessus est statique...

Merci de vos pistes de recherches

Colorer la moitié d'une case

Répondre

Étendre la vue Revue du sujet : Colorer la moitié d'une case

Re: Colorer la moitié d'une case

Re: Colorer la moitié d'une case

Re: Colorer la moitié d'une case

Colorer la moitié d'une case