GESTIONNAIRE DE FENETRE (BOUGER, REDIMENTIEONNER,TOURNER, RENDRE TRANSPARENT)
ThunderPsycho
Messages postés
180
Date d'inscription
lundi 3 juin 2002
Statut
Membre
Dernière intervention
4 février 2007
-
3 mars 2004 à 10:10
cs_le_chacal Messages postés 25 Date d'inscription mardi 28 octobre 2003 Statut Membre Dernière intervention 4 août 2005 - 10 juin 2004 à 15:34
cs_le_chacal Messages postés 25 Date d'inscription mardi 28 octobre 2003 Statut Membre Dernière intervention 4 août 2005 - 10 juin 2004 à 15:34
Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.
https://codes-sources.commentcamarche.net/source/20877-gestionnaire-de-fenetre-bouger-redimentieonner-tourner-rendre-transparent
https://codes-sources.commentcamarche.net/source/20877-gestionnaire-de-fenetre-bouger-redimentieonner-tourner-rendre-transparent
10 juin 2004 à 15:34
j'ai quelques autres truc comme ca en stock mais je n'ai plus le temps a y consacrer pour les rendre exploitable...et puis c'est souvent lié à de l'ASP (comme l'organigramme dynamique que j'ai posé sur aspfr.com )...
Si vous voulez en savoir + envoyez moi un message j'y répondrais (enfin si j'en recois pas des tonnes...)
Good coding !
10 juin 2004 à 15:02
Quand j'ai vu ce script, je l'ai trouvé excellent, mais je suis dit qu'il manquait quelques trucs. Notamment le fait qu'il soit en asp ou php
Je l'ai donc modifié, n'a besoin de rien d'autre que votre browser.
Recuperer les sources du script de chacal, puis coller ca dans un autre fichier. il manquera juste une image nommé deplacer.gif.
Voila, je remercie chacal pour son script, j'avais bosser sur un truc dans le genre, mais avec autant de fonctionalité.
Bon Allez a plus et encore merci
------------------------------------------------------------------------------
<HTML>
<HEAD>
<META NAME="GENERATOR" CONTENT="Microsoft FrontPage 5.0">
<META NAME="ProgId" CONTENT="FrontPage.Editor.Document">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
<TITLE>Nouvelle page 1</TITLE>
<script language="Javascript1.2">
var Objet;
var ObjetRes;
var DecX = 0;
var DecY = 0;
var PosX = 0;
var PosY = 0;
var Type = "";
var Angle = 0;
var actu;
var prec;
var demarre = "non";
/*var actu=document.all('Texte1');
var prec=document.all('Texte1');*/
var indexcpt=100;
function Bouge(Obj)
{
actu=Obj;
aff(Obj);
Obj = document.getElementById("dep");
actu.style.display='none';
TransParent(actu.id,100,1,100);
actu.style.zIndex=indexcpt++;
Obj.style.zIndex=indexcpt++;
if (prec != null && prec != actu)
{
TransParent(prec.id,5,1,70);
}
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
Objet = Obj;
if (Objet) {
Decal();
document.onmousedown = OnDown;
// document.onmouseup = Release;
}
}
function bouger(Obj)
{
// S'il n'y a pas de deplacement en cours, on attrape la piece
if (demarre == "non")
{
Bouge(Obj);
}
// S'il y a un deplacmeent en cours, on pose la piece
if (demarre == "oui")
{
Objet = document.getElementById("dep");
Release();
}
}
function OnDown ()
{
var nom = "fr_" + Objet.id;
if (document.getElementById(nom))
document.getElementById(nom).style.display='none';
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
if (Type == "MOVE") {
document.onmousemove = posit;
}
/*else if (Type == "RESIZE") {
document.onmousemove = defTaille;
}*/
// document.onmouseup = Release;
}
function OnDownRes ()
{
var nom = "fr_" + ObjetRes.id;
if (document.getElementById(nom))
document.getElementById(nom).style.display='none';
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
/* if (Type == "MOVE") {
document.onmousemove = posit;
} else */
if (Type == "RESIZE") {
document.onmousemove = defTaille;
}
document.onmouseup = ReleaseRes;
}
function Decal() {
Type = "MOVE";
if (Objet) {
OldX = parseInt(Objet.style.left);
OldY = parseInt(Objet.style.top);
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
DecX = x - OldX;
DecY = y - OldY;
} else {
return -1;
}
}
function Release()
{
demarre = "non";
var nom = "fr_" + actu.id;
actu.style.display='';
if (document.getElementById(nom))
document.getElementById(nom).style.display='';
if (Type == "MOVE" && Objet)
{
actu.style.top = Objet.style.top;
actu.style.left = Objet.style.left;
/* ObjetDep.style.width=parseInt(Objet.style.width)+15;
ObjetDep.style.height=parseInt(Objet.style.height)+42;*/
Objet.style.visibility='hidden';
}
Objet = 0;
prec=actu;
}
function ReleaseRes()
{
var nom = "fr_" + ObjetRes.id;
if (document.getElementById(nom))
document.getElementById(nom).style.display='';
if (Type == "RESIZE")
{
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
Wd = (PosX - x)*(-1);
He = (PosY - y)*(-1);
ResizeItFR(Wd,He);
}
ObjetRes = 0;
}
function posit(){
if (Objet) {
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
if ( x%5 0 || y%5 0 )
{
NewX = x - DecX;
NewY = y - DecY;
moveIt(NewX,NewY);
}
// window.status = Objet.id+"(X="+NewX+",Y="+NewY+")";
} else {
return -1;
}
}
function moveIt(x,y){
if (Objet) {
demarre = "oui";
Objet.style.top = y;
Objet.style.left = x;
} else {
return -1;
}
}
function ChangeTaille(Obj)
{
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
ObjetRes = Obj;
if (ObjetRes) {
RepereIt();
document.onmousedown = OnDownRes;
document.onmouseup = ReleaseRes;
}
}
function RepereIt() {
Type = "RESIZE";
if (ObjetRes) {
PosX = parseInt(ObjetRes.style.left);
PosY = parseInt(ObjetRes.style.top);
}
}
function defTaille () {
if (ObjetRes) {
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
Wd = (PosX - x)*(-1);
He = (PosY - y)*(-1);
ResizeIt(Wd,He);
} else {
return -1;
}
}
function ResizeIt(Wd,He) {
if (Wd > 30 && He > 40) {
ObjetRes.style.width=Wd;
ObjetRes.style.height=He;
}
}
function ResizeItFR(Wd,He)
{
var nom = "fr_" + ObjetRes.id;
if (Wd > 29 && He > 39) {
if (document.getElementById(nom))
{
document.getElementById(nom).width = Wd;
document.getElementById(nom).height = He;
}
}
}
function degToRad (angle) {
angle = (angle/ 180) * 3.142;
return angle;
}
function rotate(name, angle){
//convert angle into radians
var rad = degToRad(angle);
//calculate cos and sin of the angle
costheta = Math.cos(rad);
sintheta = Math.sin(rad);
//create object reference
var Target = document.getElementById(name);
if(Target) {
//apply the filter
Target.style.filter = "progid:DXImageTransform.Microsoft.Matrix();";
//set up the properties
Target.filters.item("DXImageTransform.Microsoft.Matrix").SizingMethod = "auto expand";
Target.filters.item("DXImageTransform.Microsoft.Matrix").FilterType = "bilinear";
//apply the rotation matrix transformation
Target.filters.item("DXImageTransform.Microsoft.Matrix").M11 = costheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M12 = -sintheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M21 = sintheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M22 = costheta;
}
}
function TransParent(name,Begin,Type,End) {
var Target = document.getElementById(name);
if (Target) {
Target.style.filter="Alpha";
Target.filters.item("Alpha").opacity = Begin;
Target.filters.item("Alpha").FinishOpacity = End;
Target.filters.item("Alpha").Style = Type;
}
}
function MagicEffect(Name,Angle,Mir,Inv,Xray,Gray,Opac) {
var Target = document.getElementById(Name);
if (Target) {
Target.style.filter = "progid:DXImageTransform.Microsoft.BasicImage();";
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Rotation = Angle;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Mirror = Mir;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Invert = Inv;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").XRay = Xray;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Grayscale = Gray;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Opacity = Opac;
}
}
function aff(obj)
{
var ObjetDep = document.getElementById("dep");
// var ObjetRef1 = document.getElementById("Texte2");
var nom = "fr_"+obj.id;
var ObjetRef3 = document.getElementById(nom);
var ObjetRef1 = obj;
ObjetDep.style.zIndex=indexcpt++;
/*alert(ObjetRef3.height);
alert(ObjetRef3.width);
*/
ObjetDep.style.top = ObjetRef1.style.top;
ObjetDep.style.left = ObjetRef1.style.left;
if (ObjetRef3){
ObjetDep.style.width=parseInt(ObjetRef3.width)+15;
ObjetDep.style.height=parseInt(ObjetRef3.height)+42;}
ObjetDep.style.visibility='visible';
}
function creaff(lien,nom)
{
var chainediv ="";
if (!document.getElementById(nom))
{
newsrc = lien;
chainediv = chainediv + "
";
chainediv = chainediv + " \";
// chainediv = chainediv + \" ----
\";
chainediv = chainediv + \" ----
\";
chainediv = chainediv + \" , \";
chainediv = chainediv + \" "+nom+", \";
chainediv = chainediv + \" , \";
chainediv = chainediv + \" \";
chainediv = chainediv + \" ----
\";
chainediv = chainediv + \" , \";
chainediv = chainediv + \" ";
chainediv = chainediv + "<table>----, \";
chainediv = chainediv + \"\";
chainediv = chainediv + \"\";
chainediv = chainediv + "</td>
";
chainediv = chainediv + " </TD>";
chainediv = chainediv + " <TD bgcolor=#ECE8D8 BACKGROUND="Pict/Cadre/Right.gif"></TD>";
chainediv = chainediv + " </TR>";
chainediv = chainediv + " <TR>";
chainediv = chainediv + " <TD WIDTH="3" height=3></TD>";
chainediv = chainediv + " <TD bgcolor=#ECE8D8 BACKGROUND="Pict/Cadre/Bottom.gif"></TD>";
chainediv = chainediv + " <TD WIDTH="3" height=3></TD>";
chainediv = chainediv + " </TR>";
chainediv = chainediv + " </TABLE>";
chainediv = chainediv + "
";
chainediv = chainediv + "
";
chainediv = chainediv + " \";
chainediv = chainediv + \"
";
chainediv = chainediv + "
";
chainediv = chainediv + "
";
chainediv = chainediv + " \";
chainediv = chainediv + \" ----
";
chainediv = chainediv + "
";
chainediv = chainediv + "
";
document.body.innerHTML = document.body.innerHTML + " " + chainediv;
}
else
document.getElementById(nom).style.display='';
if (actu== null && prec== null)
{
actu=document.getElementById(nom);
prec=document.getElementById(nom);
}
}
function menu()
{
var Target=document.all('ChoixAngTexte1');
if (Target.style.display=='none')
Target.style.display='';
else
Target.style.display='none';
}
</script>
<link rel="STYLESHEET" type="text/css" href="feuille.css">
</HEAD>
Déplacement en cours...
[javascript:menu() menu]
popup
,
----
popup176.htm
,
----
popup177.htm
,
----
test.html
</HTML>
11 mars 2004 à 10:37
Tout d'abord, sympa ta source le_chacal, manque peut etre des commentaires pour les debutants, sinon je te mets 9/10 car ca les merite.
Ibuto, j'ai repris son code et je l'ai mis en php, le voila :
//-------------------------------------------------------------------------//
<?
function NewDiv ($La,$Lo,$Typ,$Cont,$Nom){
$PosT = 200;
$PosL = 200;
?>
" STYLE="z-index:10;position: absolute; top:<? echo $PosT; ?>; Left: <? echo $PosL; ?>; width: <? echo $La ?>; height: <? echo $Lo ?>;filter:Shadow(Color=#909090, Direction=120) ;" >
');Bouge(Target);\" onMouseUp=\"Release();\">
,
<? echo $Nom ?>,
,
----
,
<? if ($Typ=="txt") { echo $Cont; }else {
?>
" WIDTH="100%" HEIGHT="100%">
<? } ?>,
,
----
,
,
" onMouseOver="this.style.cursor='hand'" onClick="Target=document.all('<? echo $Nom ?>');Target.style.display='none'; " STYLE="z-index: 11;position: absolute;top: 5;right: 7">
" onMouseDown="Target=document.all('<? echo $Nom ?>');ChangeTaille(Target);" onMouseUp="Release();" STYLE="z-index: 11;position: absolute;cursor:se-resize;Bottom: 4;right: 3; width:10;height : 10;">
" onMouseOver="this.style.cursor='hand'" onClick="Target=document.all('ChoixAng<? echo $Nom ?>');if (Target.style.display=='none'){Target.style.display='';}else{Target.style.display='none';} " STYLE="z-index: 11;position: absolute;top: 5;right: 20">
" STYLE="position:absolute;Top:15;Right:10;width:45;display:'none'">
');rotate('<? echo $Nom ?>',0);Target.style.display='none';">0 °
,
----
');rotate('<? echo $Nom ?>',10);Target.style.display='none';">+ 10 °
,
----
');rotate('<? echo $Nom ?>',30);Target.style.display='none';">+ 30 °
,
----
');rotate('<? echo $Nom ?>',60);Target.style.display='none';">+ 60 °
,
----
');rotate('<? echo $Nom ?>',120);Target.style.display='none';">+ 120 °
,
----
');rotate('<? echo $Nom ?>',180);Target.style.display='none';">+ 180 °
" onMouseOver="this.style.cursor='hand'" onClick="Target=document.all('ChoixDeg<? echo $Nom ?>');if (Target.style.display=='none'){Target.style.display='';}else{Target.style.display='none';} " STYLE="z-index: 11;position: absolute;top: 5;right: 32">
" STYLE="position:absolute;Top:15;Right:20;width:45;display:'none'">
');TransParent('<? echo $Nom ?>',100,0,100);Target.style.display='none';">100%
,
----
');TransParent('<? echo $Nom ?>',90,0,100);Target.style.display='none';">90%
,
----
');TransParent('<? echo $Nom ?>',80,0,100);Target.style.display='none';">80%
,
----
');TransParent('<? echo $Nom ?>',70,0,100);Target.style.display='none';">70%
,
----
');TransParent('<? echo $Nom ?>',60,0,100);Target.style.display='none';">60%
,
----
');TransParent('<? echo $Nom ?>',50,0,100);Target.style.display='none';">50%
,
----
');TransParent('<? echo $Nom ?>',40,0,100);Target.style.display='none';">40%
<? $PosT = $PosT + 20;
$PosL = $PosL + 20;
}
?>
<HTML>
<HEAD>
<META NAME="GENERATOR" CONTENT="Microsoft FrontPage 5.0">
<META NAME="ProgId" CONTENT="FrontPage.Editor.Document">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
<TITLE>Nouvelle page 1</TITLE>
<SCRIPT language="Javascript1.2">
var Objet;
var DecX = 0;
var DecY = 0;
var PosX = 0;
var PosY = 0;
var Type = "";
var Angle = 0;
function Bouge(Obj) {
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
Objet = Obj;
if (Objet) {
Decal();
document.onmousedown = OnDown;
document.onmouseup = Release;
}
}
function OnDown () {
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
if (Type == "MOVE") {
document.onmousemove = posit;
} else if (Type == "RESIZE") {
document.onmousemove = defTaille;
}
document.onmouseup = Release;
}
function Decal() {
Type = "MOVE";
if (Objet) {
OldX = parseInt(Objet.style.left);
OldY = parseInt(Objet.style.top);
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
DecX = x - OldX;
DecY = y - OldY;
} else {
return -1;
}
}
function Release() {
Objet = 0;
}
function posit(){
if (Objet) {
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
NewX = x - DecX;
NewY = y - DecY;
window.status = Objet.id+"(X="+NewX+",Y="+NewY+")";
moveIt(NewX,NewY);
} else {
return -1;
}
}
function moveIt(x,y){
if (Objet) {
Objet.style.top = y;
Objet.style.left = x;
} else {
return -1;
}
}
function ChangeTaille(Obj) {
if(navigator.appName.substring(0,3) == "Net"){
document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE|Event.MOUSEUP);
}
Objet = Obj;
if (Objet) {
RepereIt();
document.onmousedown = OnDown;
document.onmouseup = Release;
}
}
function RepereIt() {
Type = "RESIZE";
if (Objet) {
PosX = parseInt(Objet.style.left);
PosY = parseInt(Objet.style.top);
}
}
function defTaille () {
if (Objet) {
x (navigator.appName.substring(0,3) "Net") ? e.pageX : event.x + document.body.scrollTop;
y (navigator.appName.substring(0,3) "Net") ? e.pageY : event.y + document.body.scrollLeft;
Wd = (PosX - x)*(-1);
He = (PosY - y)*(-1);
ResizeIt(Wd,He);
} else {
return -1;
}
}
function ResizeIt(Wd,He) {
if (Wd > 30 && He > 40) {
Objet.style.width=Wd;
Objet.style.height=He;
}
}
function degToRad (angle) {
angle = (angle/ 180) * 3.142;
return angle;
}
function rotate(name, angle){
//convert angle into radians
var rad = degToRad(angle);
//calculate cos and sin of the angle
costheta = Math.cos(rad);
sintheta = Math.sin(rad);
//create object reference
var Target = document.getElementById(name);
if(Target) {
//apply the filter
Target.style.filter = "progid:DXImageTransform.Microsoft.Matrix();";
//set up the properties
Target.filters.item("DXImageTransform.Microsoft.Matrix").SizingMethod = "auto expand";
Target.filters.item("DXImageTransform.Microsoft.Matrix").FilterType = "bilinear";
//apply the rotation matrix transformation
Target.filters.item("DXImageTransform.Microsoft.Matrix").M11 = costheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M12 = -sintheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M21 = sintheta;
Target.filters.item("DXImageTransform.Microsoft.Matrix").M22 = costheta;
}
}
function TransParent(name,Begin,Type,End) {
var Target = document.getElementById(name);
if (Target) {
Target.style.filter="Alpha";
Target.filters.item("Alpha").opacity = Begin;
Target.filters.item("Alpha").FinishOpacity = End;
Target.filters.item("Alpha").Style = Type;
}
}
function MagicEffect(Name,Angle,Mir,Inv,Xray,Gray,Opac) {
var Target = document.getElementById(Name);
if (Target) {
Target.style.filter = "progid:DXImageTransform.Microsoft.BasicImage();";
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Rotation = Angle;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Mirror = Mir;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Invert = Inv;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").XRay = Xray;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Grayscale = Gray;
Target.filters.item("DXImageTransform.Microsoft.BasicImage").Opacity = Opac;
}
}
</SCRIPT>
</HEAD>
<? $Tst = $Test;
if ($Tst == "True"){ ?>
<?
$La = $Larg;
$Lo = $Long;
$Img = $Img;
$La1 = $Larg1;
$Lo1 = $Long1;
$Txt = $Texto;
if ($La!="" && $Lo!="" && $Img!=""){
NewDiv ($La,$Lo,"Img",$Img,"Image 1");
}
if ($La1!="" && $Lo1!="" && $Txt!=""){
NewDiv ($La1,$Lo1,"txt",$Txt,"Texte 1");
}
?>
<? } ?>
<FORM METHOD="POST" NAME=Form1 ACTION="Test.php" >
Image :Largeur :
Longueur :
Image :
Texte :
Largeur :
Longueur :
Texte :
<TEXTAREA ROWS=6 NAME=Texto COLS=81></TEXTAREA><SCRIPT language="JavaScript1.2">//editor_generate('Texto');</SCRIPT>
</FORM>
</HTML>
//-------------------------------------------------------------------------//
Je n'ai fait que migrer le code de ASP a PHP et 2 petites retouches pour corriger les erreurs.
Voila, bonne continuation.
8 mars 2004 à 09:30
++
8 mars 2004 à 06:56
3 mars 2004 à 10:36
J'avais pensé à faire la rotation à la souris mais tant que j'ai pas une fonction super nickel d'interception des mouvements je vais m'abstenir
je vais surement me repencher dessus pour fignoler et rajouter des fonctions
Pour ce qui est de l'asp la c'étais juste pour les essais , c'est sur que d'habitude c'est plus propre mais la le but c'est pas l'ASP et en plus y en a pas beaucoup alors je me suis pas pris la tête je l'ai laissé tel quel...Sorry ;-)
++
3 mars 2004 à 10:10
Mais je suis sur que ca servira à qqun...
A part ça, la source reste vraiment pas mal est en fait toute simple. C sympa. Just deux choses :
- Ca serait pas mal d'ajouter une fonction pour effectuer une rotation avec la souris, en l'activant lorsque la souris est présente près de l'angle de l'image
- Et les manipulations sont lourdes, et ca en chie pas mal ( j'imagine meme pas pour une rotation à la souris ;o) ). si tu veux avoir un bon gain en performances, oublies les fonctions et les variables asp et fait tout en javascript, je m'explique :
Le truc qui fait le plus cracher ton serveur c'est le fait d'appeler de l'asp sans arrêt ( à chaque fois que tu effectues <%%> ). Tu obliges, lors de la compilation, ton serveur à basculer entre le compilateur asp et l'interpréteur html à chaque appel, ce qui constitue une manip lourde et qui fait perdre bcp de temps lors de l'envoi de ta page au client.
Voila, 9/10