Accueil > Forum > > > > deplacement de plusieurs div
deplacement de plusieurs div
jeudi 16 février 2006 à 10:46:28 |
deplacement de plusieurs div

pegasus77
|
Bonjour ,
voila j'essaie de faire une fonction qui
me permettra de deplacer plusieurs DIV. j'ai pris un code draganddrop qui me
permet de deplacer un et un seul DIV (ce qui marche) et je bidouille pour faire en sorte
que ca marche pour tous les DIV de ma page. voici mon code javascript:
function mymove(aLayerPlage){
onmousedown=
ma_fonction(aLayerPlage);
} function ma_fonction(aLayerPlage,e) {
if (ie) { window.lastX=event.clientX;
window.lastY=event.clientY; onmousemove = doDrag(aLayerPlage);
onmouseup=endDrag; } } function doDrag(aLayerPlage) {
if
(ie) { var difX=event.clientX-window.lastX; var
difY=event.clientY-window.lastY; var newX1 =
parseInt(aLayerPlage.style.left)+difX; var newY1 =
parseInt(aLayerPlage.style.top)+difY; aLayerPlage.style.left=newX1+"px";
aLayerPlage.style.top=newY1+"px"; window.lastX=event.clientX;
window.lastY=event.clientY; } } function endDrag(e) {
if (ie || ns4) { document.onmousemove=null; } }
et dans la page HTML j'ai X DIV comme ci dessous:
<div
class="PLAGE" id="test0" style="top: 0px; left: 76px; height: 77px; width:
153px; " onmousedown="mymove(this);"
>BLABLA<br/>(vide)<br/>BRUNEL JEAN
MARC<br/>Promotion</div>
<div class="PLAGE" id="test1"
style="top: 0px; left: 134px; height: 77px; width: 114px; "
onmousedown="mymove(this);" >BLABLA BONJOUR<br/>(vide)<br/>DUJOUR
CLAUDE<br/>Promotion</div>
Merci d'avance de me sortir
de mon impassemanu
|
|
jeudi 16 février 2006 à 12:01:21 |
Re : deplacement de plusieurs div

bultez
|
Bonjour, déplacer ? ° toutes en même temps ou celle sur laquelle on clique d'abord ? ° en fonction de la position de la souris ? si oui, un ch'tit exemple
<script type="text/javascript"> var deplace=false; function mymove() { if ( deplace ) { deplace.style.top=event.clientY; deplace.style.left=event.clientX; } } </script> <body onmousemove="mymove();" onmouseup="deplace=false;"> <div class="PLAGE" id="test0" style="position : absolute;top: 100px; left: 76px; height: 77px; width: 153px; background-color:#FFFF00; " onmousedown="deplace=this;">BLABLA<br/>(vide)<br/>BRUNEL JEAN MARC<br/>Promotion</div> <div class="PLAGE" id="test1" style="position : absolute;top: 150px; left: 134px; height: 77px; width: 114px; background-color:#FF8000" onmousedown="deplace=this;">BLABLA BONJOUR<br/>(vide)<br/>DUJOUR CLAUDE<br/>Promotion</div>
peu de choses à faire pour adapter avec le renard de feu. Cordialement. Bul. ~ Mon Site qu'il est à Moi ~
|
|
jeudi 16 février 2006 à 14:29:21 |
Re : deplacement de plusieurs div

pegasus77
|
Merci de ta réponse rapide bultez,
j'ai mis en place ta solution et je comprends pas mes layers se deplace bien mais ya un decalage de mon layer a chaque fois que je veux le deplacer en bas à droite. je me suis dis qu'il fallait refaire le calcul comme je faisais avant, mais ca plante
voila le code :
function mymove() { if ( deplace,e ) { // deplace.style.top=event.clientY; ( ton code precedent est en commentaire) // deplace.style.left=event.clientX;
var difX=event.clientX-window.lastX; var difY=event.clientY-window.lastY;
var newX1 = parseInt(deplace.style.left)+difX; var newY1 = parseInt(deplace.style.top)+difY; deplace.style.left=newX1+"px"; deplace.style.top=newY1+"px";
window.lastX=event.clientX; window.lastY=event.clientY; } } merci de ton aide manu
|
|
jeudi 16 février 2006 à 15:03:41 |
Re : deplacement de plusieurs div

bultez
|
si style="position:absolute... pas de raison à ce décalage. pour l'erreur sur ton script, c'est quoi window.lastX ou lastY ? je suppose que tu voulais des variables globales ? et elles ne sont pas initialisées, si ? ===> en dehors de toute function var lastX=0,lastY=0; et dans les function utiliser lastX et lastY. mais inutile ce me semble ? Cordialement. Bul. ~ Mon Site qu'il est à Moi ~
|
|
jeudi 16 février 2006 à 15:59:45 |
Re : deplacement de plusieurs div

pegasus77
|
Oui en effet, je suis desole je n'avais pas remarque le position absolute dans le div que tu as rajouté. Cependant meme avec ca , j'ai un decalage !!!!!!!!!! c bizzare manu
|
|
jeudi 16 février 2006 à 16:05:27 |
Re : deplacement de plusieurs div

bultez
|
on peut voir le script ( enfin un petit bout d'extrait ) car , je viens de dire la même chose à quelqu'un d'autre et je sais que c'est agaçant d'entendre ça : pas de raisons. Cordialement. Bul. ~ Mon Site qu'il est à Moi ~
|
|
jeudi 16 février 2006 à 16:11:04 |
Re : deplacement de plusieurs div

pegasus77
|
oui voici mon code javascript
<script type="text/javascript"> var deplace=false; function mymove() { if ( deplace ) { deplace.style.top=event.clientY; deplace.style.left=event.clientX; } } </script>
le body: <body bgcolor="#9EBCDC" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onmousemove="mymove();" onmouseup="deplace=false;"> et les div: <div class="PLAGE" id="test" style="position: absolute; top: 0px; left: 76px; height: 77px; width: 153px; " onmousedown="deplace=this;" > Droit Industriel<br/>(vide)<br/>BRUNEL JEAN MARC<br/>Promotion</div>- <div class="PLAGE" id="P167.0" style="position: absolute; top: 0px; left: 134px; height: 77px; width: 114px;" onmousedown="deplace=this;" > MANAGEMENT DU TOURISME<br/>(vide)<br/>DUJOUR CLAUDE<br/>Promotion</div>
manu
|
|
jeudi 16 février 2006 à 16:26:44 |
Re : deplacement de plusieurs div

bultez
|
je ne remarque aucun décalage ? maintenant on peut jouer avec deplace.style.top=event.clientX+ ou - valeur; ??? Cordialement. Bul. ~ Mon Site qu'il est à Moi ~
|
|
jeudi 16 février 2006 à 16:28:35 |
Re : deplacement de plusieurs div

bultez
|
je met dans le style du 1er div background-color:#FFFF00 et #FF8000 dans le 2ème pour contrôler, et tout va bien. Cordialement. Bul. ~ Mon Site qu'il est à Moi ~
|
|
jeudi 16 février 2006 à 16:29:41 |
Re : deplacement de plusieurs div
|
Cette discussion est classée dans : function, window, div, event, alayerplage
Répondre à ce message
Sujets en rapport avec ce message
Resize javascript [ par Mip ]
Bonjour, je fais appel a vous pour un petit probleme.Ce code marche correctement sous firefox, le javascript est bien lance et la fonction bien appele
Comment executer le code d'un bouton en appuyant sur une touche? [ par LionHearth ]
Bonjour,Je cherche à appeler la procédure click d'un bouton en appuyant sur une touche.Je m'explique... Je dois executer le code d'un bouton annuler e
Conflit balises DIV [ par finelarme ]
Bonjour, J'ai un problème pour "combiner" deux balises DIV. Il y'à deux actions dans ma page : un compte à rebours que j'ai paramêtré et un fader su
Retour variable palette graphique [ par neooh56 ]
Bonjour J'ai recupéré un script de pallette graphique je clic sur un bouton ca ouvre la palette et quand je clic sur une couleur ca la ferme et renvoi
Glisser Déposer problèeme avec Event target sur firefox [ par ob1knob ]
Salut à tous,Ca fait 2 jours que je cherche à trouver pourquoi sur firefox, lorsque je mousedown sur un div avec une posisiton absolute, et que je mou
[MSIE] window.event.button retourne toujours 0 [ par juki_webmaster ]
Bonjour, Aprés avoir ecumer les horreurs JS des quatres coins du web, je me tourne vers vous. Dans mon code, je fixe un callback pour les evements c
deplacer des div avec la souris [ par reski_01 ]
bonjour a tous, j'ai chercher partout mais je ne trouve pas comment modifier ce que j'ai pu collecter je voudra
onkeypress = function sous IE ne fonctionne pas, une autre solution? [ par maelob ]
Bonjour à tous,comme expliquer dans ce sujet : http://www.javascriptfr.com/infomsg_FONCTION-REPLACE-EMULER-CAPS-LOCK_1069004.aspx#7Je suis en train de
Comment annuler la touche enter uniquement que dans un champ input text [ par Jarod1980 ]
Bonjour,Je voudrais savoir si il est possible d'annuler la touche enter dans un champ input bien précis et pas dans mon champ textarea. J'ai essayé
Requete sql en dans une function javascript [ par destiny ]
Lo allEn gros avec une ptite function js,function EmplIns(LEmpl,StD,StF) { //alert('LEmpl = ' + LEmpl); window.opener.document.getElementById('Debut s
Livres en rapport
|
Derniers Blogs
JOYEUX ANNIVERSAIRE NIXJOYEUX ANNIVERSAIRE NIX par ebartsoft
Souhaitons un bon et joyeux anniversaire à notre hôte à tous, Nix.
Je ne le répéterais jamais assez mais sans lui rien ne serait possible. Il défit en permanence les lois de la gravité et comme il le dit si bien, si tu lui fais confiance ça devra...
Cliquez pour lire la suite de l'article par ebartsoft IMAGINE CUP 2012, MAKE A SIGN EN FINALEIMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg
Voilà qui est fait, la nouvelle est officielle ! L'équipe belge "Make a Sign" va au pays des kangourous défendre son projet dans la catégorie Software Design. http://www.imaginecup.com/CompetitionsContent/Competition/WorldwideFinalists.aspx V...
Cliquez pour lire la suite de l'article par junarnoalg KINECT 1.5 IS OUT !KINECT 1.5 IS OUT ! par Vko
La version 1.5 du Kinect For Microsoft vient tout juste de sortir ! Plein de nouveautés: Tracking de squelette en Near Mode Détection en position assise Détection faciale avec un SDK dédié Documentation et des guideline (enfin) Un out...
Cliquez pour lire la suite de l'article par Vko LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc
Mise à jour des Web API du 14 Mai
Réservez dès maintenant votre journée du 20 juin pour le Windows Azure Dev Camp 2012 à Paris
Mise à jour de Team Foundation Service
MechCommander 2 sur Windows 8
Entity Framework 5 Release Candidate e...
Cliquez pour lire la suite de l'article par richardc REACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITERREACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITER par Groc
Une mauvaise utilisation de rx lors de l'écriture d'une couche d'accès à des services peut conduire à des cas embarassants avec des erreurs mal gérées, des appels qui ne partent lorsqu'ils le devraient, et même des résultats incorrects . le tout nuis...
Cliquez pour lire la suite de l'article par Groc
Forum
UTILISER UN .JSUTILISER UN .JS par zaikoe
Cliquez pour lire la suite par zaikoe
Logiciels
sDEVIS-FACTURES vlPRO (8.1.0.3)SDEVIS-FACTURES VLPRO (8.1.0.3)sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa... Cliquez pour télécharger sDEVIS-FACTURES vlPRO 974 Application Server (12.2.4.6)974 APPLICATION SERVER (12.2.4.6)Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc... Cliquez pour télécharger 974 Application Server vPicture (1.4.2.1)VPICTURE (1.4.2.1)Avec vPicture, hébergez vos images facilement et rapidement.
vPicture est un utilitaire simple, ... Cliquez pour télécharger vPicture Easy-Planning (2.2.1.6)EASY-PLANNING (2.2.1.6)Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au... Cliquez pour télécharger Easy-Planning COM-BACKUP (2.0)COM-BACKUP (2.0)
COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...
Cliquez pour télécharger COM-BACKUP
|