11540 sujets

JavaScript, DOM et API Web HTML5

Récupération de valeur jquery

Bonsoir a tous je donne le code et vous explique le problème après.
Le html du code donne ça .
<div id="00" class="tuille ui-droppable" style="left:0px; top:0px;"></div>
<div id="01" class="tuille ui-droppable" style="left:45.5px; top:23px;"></div>
<div id="02" class="tuille ui-droppable" style="left:91px; top:46px;"></div>
<div id="03" class="tuille ui-droppable" style="left:136.5px; top:69px;"></div>
<div id="04" class="tuille ui-droppable" style="left:182px; top:92px;"></div>
<div id="05" class="tuille ui-droppable" style="left:227.5px; top:115px;"></div>
<div id="06" class="tuille ui-droppable" style="left:273px; top:138px;"></div>
<div id="07" class="tuille ui-droppable" style="left:318.5px; top:161px;"></div>
<div id="08" class="tuille ui-droppable" style="left:364px; top:184px;"></div>



Le soucis c'est que quand je drop sur l'id 00 sa me renvoie bien 00, et si je drop sur l'id 01 eh bien ca me renvoie 00 , puis si je drop sur l'id 02 ça me renvoie 01 et ainsi entraine un décalage tout le temps
    $( ".tuille" ).droppable({
                      
			drop: function( event, ui ) {
                            var id =($(this).attr('id'));
                            alert(id); 
                            var left =parseInt($(this).css('left'))+55;
                            var top = parseInt($(this).css('top'))+5;
                                ui.draggable.appendTo( "#pp3diso-clicks" )  
                              
                                .css({                             
                                        left: left,
                                        top:top
                                      
                                   
                                    })
                            
                              
			}
             });

Voila je comprend pas d'ou viens ce décalage merci de votre aide
Salut,

As-tu vérifié que le bloc sur lequel tu droppais ton élément était bien celui que tu attendais ?

Ensuite, petite note de côté, un `id` doit absolument commencé par une lettre, sinon il est invalide (même chose pour les `class`).
Merci de ta réponse oui je drop bien sur la class tuille ce que je recherche.
Je comprend vraiment pas d’où peut venir se décalage ?
Merci pour la précision sur l'id.
Salut,

En fait, tes éléments "tuilles" ne sont pas vraiment des losanges !
Pour mieux voir ce qui se passe exactement, ajoute ceci à ta classe .tuille :
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid red;

Si tu droppes dans une zone sans superposition, no problemo.
Dès que tu droppes dans une zone ou les rectangles se superposent... Smiley ohwell

NB : Il me semble que tu charges 2x jquery...

tm
Sujet clos
Aller à