begin process at 2012 05 29 05:05:53
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Archive Javascript

 > 

Archives

 > 

AU SECOURS !!!

 > 

deplacement de plusieurs div


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

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 impasse

manu
jeudi 16 février 2006 à 12:01:21 | Re : deplacement de plusieurs div

bultez

Membre Club

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

Membre Club

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

Membre Club

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

Membre Club

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

Membre Club

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

bultez

Membre Club

j'ai mis des background-color:couleur pour contrôler et tout va bien
en fin pour moi
Cordialement. Bul. ~ Mon Site qu'il est à Moi ~


1 2

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


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,967 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales