changement couleur de fond et de texte
Bonjour,
Je souhaite changer la couleur du fond et du texte dans un tableau html.
Voici le code incriminé :
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85
|
<html>
<head>
<title></title>
<script language="javascript" type="text/javascript">
function choisirFond(choix1)
{
var xcouleur = choix1.options[choix1.options.selectedIndex].id;
if(xcouleur!='def')
{
document.getElementById("tab").style.backgroundColor=xcouleur;
document.form.fond1.value=xcouleur
alert(document.form.fond1.value);
} else {
document.getElementById("tab").style.backgroundColor="white";
}
}
function choisirTexte(choix2)
{
var ycouleur = choix2.options[choix2.options.selectedIndex].id;
if(ycouleur!='def')
{
document.getElementById("texte").style.color=ycouleur;
document.form.text1.value=ycouleur;
alert(document.form.text1.value);
} else {
document.getElementById("texte").style.color="black";
}
}
function soumis() {
alert("Soumis, Fond:"+document.form.fond1.value
+" couleur: "+document.form.text1.value)
}
</script>
</head>
<body>
<form action="recup.php" method="post" name="form" onsubmit="soumis()">
<table width="200" border="2">
<tr id="tab" bgcolor="" id="texte" style="color: red">
<td>Couleur</td>
<td>
<select name="select_fond" onchange="choisirFond(this)">
<option id="def" selected style="background:white">Choisir une couleur...</option>
<option id="blue" style="background:blue">blue</option>
<option id="chocolate" style="background:chocolate">chocolate</option>
<option id="red" style="background:red">red</option>
<option id="yellow" style="background:yellow">yellow</option>
<option id="green" style="background:green">green</option>
<option id="cyan" style="background:cyan">cyan</option>
<option id="tomato" style="background:tomato">tomato</option>
</select>
</td>
</tr>
<tr id="tab" bgcolor="" id="texte" style="color: red">
<td>Ecrit</td>
<td>
<select name="select_texte" onchange="choisirTexte(this)">
<option id="def" selected style="background:black">Choisir une couleur...</option>
<option id="blue" style="color:blue">blue</option>
<option id="chocolate" style="color:chocolate">chocolate</option>
<option id="red" style="color:red">red</option>
<option id="yellow" style="color:yellow">yellow</option>
<option id="green" style="color:green">green</option>
<option id="cyan" style="color:cyan">cyan</option>
<option id="tomato" style="color:tomato">tomato</option>
</select>
</td>
</tr>
<tr id="tab" bgcolor="" id="texte" style="color: red">
<td colspan="2">Titre </td>
</tr>
<tr id="tab" bgcolor="" id="texte" style="color: red">
<td colspan="2">Première ligne </td>
</tr>
<tr id="tab" bgcolor="" id="texte" style="color: red">
<td colspan="2">Deuxième ligne </td>
</tr>
</table>
<input type="hidden" name="fond1" value="">
<input type="hidden" name="text1" value="">
<input type="submit" value="Submit" />
</form>
</body>
</html> |
Merci de votre aide.
Cordialement.