CSS Transform

Bonjour,

Je viens demander de l'aide pour un problème que je n'arrive pas à résoudre et je ne trouve d'informations nul part.

Je développe actuellement une application en HTML/CSS/JS que je fais tourner sur Chrome. Jusque là pas de problème.
Pour faire court, le but est de faire défiler de gauche à droite des polaroids infiniment (une fois arrivé à droite on le recharge à gauche). Quand on clique sur un polaroid, il s'arrête.

Les animations et actions sont faites. Les div se déplacent bien grace à des transform : translate (j'utilise également la lib Transit : http://ricostacruz.com/jquery.transit/) . J'ai juste une problème, j'ai beau cliquer sur mes polaroids, ils s’arrêtent une fois sur 3. Et j'ai compris la cause du problème, les "zones actives" de mes div ne se déplacent pas au même rythme que ces div eux même, que leur "visuel".

Ici, la zone bleu correspond au polaroid avec la planète :
Pièce jointe 121002

Quelqu'un a t il déjà rencontré ce genre de problème et si oui, l'a t il résolu?
J'ai déjà rencontré un problème similaire avec des dashboard que je faisais bouger avec des translateX. Le problème me semble donc bien venir de cette propriété CSS ;)

Merci d'avance.

Bonjour,

Il nous faudra ton HTML généré et ton CSS pour que nous puissions t'aider.

Citation:

---

Envoyé par Vidamuerte

..., je me doute bien que lire du code pas commenté comme ça ça doit être imbouffable.

---

Je confirme.

Surtout que sans le code complet, ou mieux, une page en ligne, on ne peux rien tester...

J'ai supprimé mon message précédent. En effet le code était imbouffable et surtout, ceci étant un projet professionnel à destination d'une entreprise, je ne sais pas si c'est une bonne idée de le divulguer. De plus, pour que vous puissiez tester il faudrait que je vous donne l'intégralité du projet car tout est organisé en modules et est lié, c'est un peu galère.

Désolé pour mon erreur.
Je vais donc simplement faire un appel au partage d'expérience :
Avez vous déjà rencontré une situation où la zone active et cliquable d'un ou plusieurs div n'était plus au même endroit que votre div (avec Chrome, la zone bleue en surbrillance qui ne se retrouverait pas au bon endroit) après avoir déplacé ce dernier avec les animatiosn css?

Si oui, avez résolu le problème et comment?
Si non, merci de votre attention tout de même :)

Citation:

---

Envoyé par Vidamuerte

...Et j'ai compris la cause du problème, les "zones actives" de mes div ne se déplacent pas au même rythme que ces div eux même, que leur "visuel"...

---

Puisque tu as mis le doigt sur l'origine du problème, tu devrais savoir où chercher.

D'après ce que tu as expliqué, c'est essentiellement un script JavaScript.

Il se peut que l'image elle-même et la "zone réactive" (en bleu) sont 2 éléments distincts, animés séparéments.
Il faut voir comment ils sont créés et animés, et si possible les synchroniser (au moins comprendre pourquoi ils ne le sont pas).