Bonsoir
Pour commencer, il faut dire que j'ai jamais vraiment fait de JavaScript ... donc ce que je fais est un peu à tatillon ! Dans le cas présent j'ai récupéré en grosse partie un script d'un site spécialisé ...
Mon problème est le suivant : comme vous pouvez le voir sur http://www.zonehd.net/drag.php , on peut déplacer le div avec la souris. Vous l'avez sûrement remarqué, au premier mouvement, le div se décale tout seul ... ensuite plus de problème, il suit correctement le curseur !
Voici le code source au cas où (:D) :
Code :
- <html>
- <style type="text/css">
- .transparent {
- top:100px;
- left:100px;
- background-color:#cccccc;
- position:absolute;
- width:200;
- height:200;
- cursor:move;
- }
- .textetransp {
- color:#ffffff;
- text-decoration:none;
- filter: alpha(opacity=100);
- opacity:1;
- background-color:#336699;
- }
- </style>
- </html>
- <body>
- <script language="JavaScript1.2">
- <!--
- var ie=document.all;
- var nn6=document.getElementById&&!document.all;
- var isdrag=false;
- var x,y;
- var dobj;
- function movemouse(e)
- {
- if (isdrag)
- {
- var X = tx - x;
- var Y = ty - y;
- //alert(X+' '+Y);
- dobj.style.left = nn6 ? e.clientX + X : event.clientX + X;
- dobj.style.top = nn6 ? e.clientY + Y : event.clientY + Y;
-
- return false;
- }
-
- }
- function selectmouse(e)
- {
- var fobj = nn6 ? e.target : event.srcElement;
- var topelement = nn6 ? "HTML" : "BODY";
- while (fobj.tagName != topelement && fobj.className != "transparent" )
- {
- fobj = nn6 ? fobj.parentNode : fobj.parentElement;
- }
- if (fobj.className=="transparent" )
- {
- isdrag = true;
- // objet à déplacer
- dobj = fobj;
- // espacement gauche de l'objet
- tx = parseInt(dobj.style.left+0);
- // espacement droit de l'objet
- ty = parseInt(dobj.style.top+0);
- // position x de la souris
- x = nn6 ? e.clientX : event.clientX;
- // position y de la souris
- y = nn6 ? e.clientY : event.clientY;
- document.onmousemove=movemouse;
- return false;
- }
- }
- document.onmousedown=selectmouse;
- document.onmouseup=new Function("isdrag=false" );
- //-->
- </script>
- <div class="transparent" id="transp"><br />
- <font class="textetransp">Ceci est un essai</font> <br />
- <a href="#" onclick="document.getElementById('transp').style.visibility='hidden';">Fermer !</a></div>
- </body>
- </html>
|
Merci de votre aide par avance
Message édité par moon06 le 01-02-2006 à 20:54:18
---------------
- Si les cons volaient, il ferait nuit tout le temps ! -