[Resolu] Chrome & Jquery ui droppable

Bonjour à tous et à toutes,

tout d'abord, désolé pour l’orthographe déplorable x)

je suis en train de développer une application qui utilise le drag & drop. Tout allait bien jusqu’à ce que je teste la compatibilité de mon appli sur d'autres navigateurs ....

Sous firefox aucun soucis mais sous chrome, le droppable ne fonctionne plus. Aurez vous une idée d’où pourrait venir le problème ?

Voici quelques bouts de mon code qui pourrait vous aidé à identifier le soucis.

Les puces "droppable" (ci-dessous) sont placé grâce aux attributs css top et left.

<div id="terrain">
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" /> 
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />   
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />             
   <img style="cursor:pointer;position:relative;" class="droppable" src="./img/puce_place.png" />             
</div>

Voici le code JS de mes éléments draggable.

$( ".draggablePlayers" ).draggable({ 
        revert: function(droppableObj){
            console.log(droppableObj); // Affiche fale sous chrome quand je déplace sur mon objet droppable ?!
            if(droppableObj == false)
                return true;
                
            // Traitement 

            return false;
        },
    
        snapTolerance : 100,
        helper : "clone"
});

Le console log m'affiche un false même quand je deplace mon objet draggable sur ma zone droppable.

J'ai testé sous firefox, IE9 et Chrome et seul chrome ne fonctionne pas

Merci d'avance
Modifié par Royal (01 Feb 2012 - 09:47)

Bonjour,

personne n'aurait une idée ?

Mon explication n'est pas assez clair ? Je ne suis pas doué pour exposé mes soucis x)
Modifié par Royal (31 Jan 2012 - 16:02)

Bonjour,

problème résolu. La zone de mon droppable était tout simplement plus petite que mon objet draggable et apparemment cela foirait sous chrome.

J'ai donc utiliser la propriété "Tolerance" avec comme valeur "pointer" pour que ca résolve le soucis