Gerer dynamiquement le css a l'aide de formulaire
Bonjour a tous.
j'essaye de deplacer des images png, ( pour faire un petit jeu), a l'aide de div dans du html, et de php placé dans un fichier style.css.php.
Je reussi a modifier les position left et top a l'aide du formulaire et du php dans le css,
mais j'ai deux probleme...
les chiffres dans le style.css.php pour left et top sont modifiés, mais pour une seule div, quand je veux modifier l'autre div, c'est la div modifiée qui se retouve vidée de chiffres devant left et top, alors qu'il etait present.
le deuxieme probleme, ( j'utilise wamp et localhost ), je peux afficher la liste du css.php modifié, avec la div modifié,
mais comment faire pour que sur la carte, l'image png contenu dans la div modifiée dans le css.php, apparaisse au bon endroit sur la carte ?
Avec le fichier style.css les images png sont au bon endroit... Je vous remercie.
voici les codes du formulaire et du php ensuite:
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"><head>
<title>Field of Strategy</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document"><title>Module</title>
<link rel="stylesheet" type="text/css" href="style.css.php" />
<link rel="shortcut icon" type="image/x-icon" href="favicon.bmp" />
<head>
</head>
<body>
<div id="div2">
<br /><img src="images/armees2.png" alt="" />20
</div>
</div>
<br />
<div id="div4">
<br />
<img src="images/armees.png" alt="" />16
</div>
</div>
<p>Placez vos armées dans des coordonnées comprises, pour la hauteur entre : 395 px et 2000 px, et
placez vos armées sur les axes gauche et droite dans des coordonnées comprise entre 10 px et 1610 px.</p>
<form action="style.css.php" method="post">
<Fieldset align="left">
<legend>Mettez vos coordonnees pour placer vos armées pour le camps 1 : <img src="images/armees.png" alt="" /></legend>
<input type="text" name="$coordonnees" />
<input type="text" name="$coordonnees2" />
<input type="reset" value="effacer" />
<input type="submit" value="Envoyer" /><br /><br />
<input type="checkbox" name="armees" id="armees" /> <label
for="armees">Armees1</label><br />
<input type="checkbox" name="armees2" id="armees" /> <label
for="armees">Armees2</label><br />
<input type="checkbox" name="armees3" id="armees" /> <label
for="armees">Armees3</label><br />
<input type="checkbox" name="armees4" id="armees" /> <label
for="armees">Armees4</label>
</fieldset>
</form>
<form action="style.css.php" method="post">
<fieldset align="right">
<legend>Mettez vos coordonnees pour placer vos armées pour le camps 2 : <img src="images/armees2.png" alt="" /></legend>
<input type="text" name="$coordonnees3" />
<input type="text" name="$coordonnees4" />
<input type="reset" value="effacer" />
<input type="submit" value="Envoyer" /><br /><br />
<input type="checkbox" name="armees" id="armees" /> <label
for="armees">Armees1</label><br />
<input type="checkbox" name="armees2" id="armees" /> <label
for="armees">Armees2</label><br />
<input type="checkbox" name="armees3" id="armees" /> <label
for="armees">Armees3</label><br />
<input type="checkbox" name="armees4" id="armees" /> <label
for="armees">Armees4</label>
</fieldset>
</form>
<p> <img src="images/CmpSaxe1813.png" alt="" /></p>
</body>
</html> |
code php dans le fichier css.php:
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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
| <?php
header('content-type:text/css');//Dans le fichier styles.php, il suffit d’ajouter cette ligne pour indiquer au navigateur que le contenu doit être considéré comme du TEXT/CSS, si le link du html pointe sur style.php, mais pas sur du css
?>
#div1
{
Z-index:1;
position:absolute;/*Position absolute pour que la taille ne change pas avec la taille de la page*/
width:1900;
height:2300;
top:410px;
left: 5px;
}
#div2 {
z-index: 2;
position: absolute;
top:<?php
if (isset($_POST['$coordonnees']))//On verifie si la variable est initialisée
{
$_POST['$coordonnees'] = htmlspecialchars($_POST['$coordonnees']); // On rend inoffensives les balises HTML que le visiteur a pu rentrer
if (preg_match("#^[30-9]{2-9}+$#",$_POST['$coordonnees']))//On precise le type de rentrée de donnée a mettre
{
echo $_POST['$coordonnees'].'px';
}
else
{
echo 'Vos coordonnees ' .$_POST['$coordonnees']. ' ne sont pas correctes, veuillez mettre un chiffre valide entre 395 et 2300 !';
}
}
?>
left:<?php
if (isset($_POST['$coordonnees2']))//On verifie si la variable est initialisée
{
$_POST['$coordonnees2'] = htmlspecialchars($_POST['$coordonnees2']); // On rend inoffensives les balises HTML que le visiteur a pu rentrer
if (preg_match("#^[0-9]{1,4}+$#",$_POST['$coordonnees2']))//On precise le type de rentrée de donnée a mettre
{
echo $_POST['$coordonnees2'].'px';
}
else
{
echo 'Vos coordonnees ' .$_POST['$coordonnees2']. ' ne sont pas correctes, veuillez mettre un chiffre valide entre 395 et 2300 !';
}
}
?>
text-align: center;
}
#div4 {
z-index: 3;
position: absolute;
top:<?php
if (isset($_POST['$coordonnees3']))//On verifie si la variable est initialisée
{
$_POST['$coordonnees3'] = htmlspecialchars($_POST['$coordonnees3']); // On rend inoffensives les balises HTML que le visiteur a pu rentrer
if (preg_match("#^[0-9]{1,4}+$#",$_POST['$coordonnees3']))//On precise le type de rentrée de donnée a mettre
{
echo $_POST['$coordonnees3'].'px';
}
else
{
echo 'Vos coordonnees ' .$_POST['$coordonnees3']. ' ne sont pas correctes, veuillez mettre un chiffre valide entre 395 et 2300 !';
}
}
?>
left:<?php
if (isset($_POST['$coordonnees4']))//On verifie si la variable est initialisée
{
$_POST['$coordonnees4'] = htmlspecialchars($_POST['$coordonnees4']); // On rend inoffensives les balises HTML que le visiteur a pu rentrer
if (preg_match("#^[0-9]{1,4}+$#",$_POST['$coordonnees4']))//On precise le type de rentrée de donnée a mettre
{
echo $_POST['$coordonnees4'].'px';
}
else
{
echo 'Vos coordonnees ' .$_POST['$coordonnees4']. ' ne sont pas correctes, veuillez mettre un chiffre valide entre 395 et 2300 !';
}
}
?>
text-align: center;
}
#div6 {
z-index:3;
position: absolute;
top:650px;
left:50px;
text-align: center;
}
#div5 {
z-index: 3;
position: absolute;
top:550px;
left:500px;
text-align: center;
} |
