[RESOLU] [JQuery] Draggable dans un block overflow:hidden

Bonjour les amis,

Je suis nouveau sur le forum, pour une simple raison j'ai un soucis qui mérite une aide poussée... cela ne signifie pas qu'ensuite je vous oublierai

Voila je code un petit jeu en PHP/Jquery, et pour simplifier mon problème j'ai une div avec des images que j'aimerais drag & dropper sur d'autres div.

Jusque là facile, j'utilise Jquery et UI, mais là ou cela se complique c'est que mon div conteneur est OBLIGATOIREMENT en overflow:hidden, et du coup mon image droppée n'est visible que dans la zone... logique... (idem pour un helper).

Mais je cherche une solution propre pour que le drag puisse sortir de sa div...
Auriez vous des solutions ???
En vous remerciant par avance,

Pour ceux pour qui voudraient voir avec leurs yeux le problème c'est ici :
http://investigationline.free.fr/iol2007/
(La boîte verte en bas)
Modifié par Cymon (03 May 2009 - 21:05)

Si vous avez des retours sur l'IHM du site y'a pas de soucis... Merci !
Modifié par Cymon (30 Apr 2009 - 21:33)

Pas de solutions ?

Personne ? Pas même une solution détournée ?

Au pire des cas faites moi un petit coucou... Je me sentirais moins seul...

A+

Coucou !

Bon... blague à part, la solution ne serait-elle pas dans cette démo (seconde boîte I'm contained) ?

Merci pour ton aide !!!

Hélas triples hélas, ce n'est pas bon :
Sur la page j'ai mis le parent de
" I'm contained within the box's parent" en overflow:hidden et j'ai eu le même problème !

A+

Coucou!

Si ton div doit être en overflow hidden et que tes éléments sont enfant de celui, ce n'est pas possible.

Donc:

1. Soit ton div n'est pas en overflow hidden.

2. Soit tes éléments "dragables" ne sont pas enfant de ton div "hidden", il faut donc qu'il soit enfant directement de l'élément body, ensuite c'est seulement quand ceux ci atterrissent dans leur destination qu'il deviennent enfant du div "hidden".

Effectivement c'est difficile, j'envisage de manipuler le DOM sur l'évènement "start" du draggable (en cours de test).

Sinon par rapport a ta solution ils sont enfants du bloc "hidden" pour en sortir...
le block est hidden car les enfants ne doivent pas déborder de la zone parent, sauf si ils sont "dragué", regarde les objets en bas dans la page d'exemple http://investigationline.free.fr/iol2007/

Voila...
Modifié par Cymon (03 May 2009 - 20:44)

Il faut que tu changes l'élément de parent au moment ou tu click sur l'objet pour le bouger. Pour cela il faut récupérer sa position par rapport au body et ensuite faire le dragandrop. Ensuite à l'atterrissage, il faut récupérer la position de l'élément et de ton div et faire un soustraction pour placer celui ci correctement.

Ton exemple en ligne reste bloqué sur "chargement en cours..."
Modifié par matmat (03 May 2009 - 20:07)

a écrit :
Ton exemple en ligne reste bloqué sur "chargement en cours..."

étrange tu utilise quel navigateur ? le fermeture du bloc de chargement et sur un évènement load() d'une image... et fonctionne sous Firefox...

Merci pour ta solution je vais faire le test d'ici peu.. Merci !
Modifié par Cymon (03 May 2009 - 20:41)

Résolu !

Je viens de trouver : en cherchant à manipuler l'offset de mes objets, je suis tombé sur une option de "dragable" qui fait exactement ce que je veux : appendTo: 'body', du coup ça marche nickel !

Merci à tous !

omg. Merci énormément pour ce post Cymon !

Cela fait 1 semaine que je me prend la tête avec ça. En effet, je suis en train de mettre en place à peu près la même fonctionnalité que toi, à savoir des items draggables à l"intérieur d'un Carousel jQuery. Et impossible de faire sortir mes items du Carousel.

Bravo pour la solution, ça marche impec

Vive les forums !