11496 sujets

JavaScript, DOM et API Web HTML5

Bonjour

Je viens de découvrir une librairie ( ou framework ) js très intéressante: ElementTransition.js, elle permet de réaliser très facilement des transitions entre deux divisions :
https://github.com/dan-silver/ElementTransitions.js ( projet gitub )
http://dan-silver.github.io/ElementTransitions.js page d'exemples

Cependant je n'arrive pas à la mettre en place sur ma page html, après avoir telechargé le projet sur github, j'ai dupliqué la page index.html et vidé le body pour repartir de 0 ( toutes les sources sont bien linkées ) mais je n'arrive pas à obtenir le résultat, les pages restent statiques .

Quelqu'un aurait-il saisi a logique ? J'ai bien compris que c'est dans les attributs de la balise div que l'on indique les transitions, mais comment les déclencher ??

pour l'instant j'ai fait un simple copier-coller du premier code de la page d'exemples ( le 2eme lien ), mes 2 div sont tout bêtement l'une sur l'autre :

<div class="et-wrapper et-rotate" et-in="rotateSlideIn" et-out="rotateSlideOut">
    <div class="et-page">
    <h2>Page 1</h2>
    </div>
    <div class="et-page">
    <h2>Page 2</h2>
    </div>
    </div>


Voilà, j’espère qu'il y en a qui pourront m'aider Smiley eek Smiley smile , bonne soirée
Modifié par Rafkraft (24 Nov 2013 - 19:15)
Bonjour.

Alors je viens de tester leur démo, et les liens sont un peu foireux :

Spontanément ils renvoient sur deux 404, bon, ça se corrige assez vite, ensuite on voit le truc tourner, mais ça ne fonctionne pas gégé.

Le problème est que si tu as repris la démo, ils ont ajouté une classe no-js sur le body. Et c'est de là que vient le problème. Pour le régler, deux solutions :
- Tu l'enlèves tout bonnement de ton body
- Ou la "méthode classe", tu ajoutes un lien vers le js modernizr fourni avec qui s'occupe de l'enlever.

Si tu as un autre soucis, n'hésite pas à reposter.
Bonjour, merci pour ta réponse, et désolé de tarder à répondre

J'ai repris le document index.html ( qui vient du dossier github ) auquel j'ai enlevé tout ce que contenait le body, le body n'a pas de class, tu as du confondre avec la balise html, quoi qu'il en soit j'ai supprimé la class "no-js" de la balise html et ça ne marche toujours pas ...

Et j'ai pas vraiment compris ta deuxième méthode, le fichier modernizr.custom.js est bien linké à mon document mais toujours aucun résultat ...


Merci beaucoup en tout cas ... Smiley smile Smiley smile
Bonjour.

Perso, j'étais parti de example.html, et là je viens de tester avec index.html, en faisant la même manip que toi, j'ai tout viré sauf ton code, et tout fonctionne nickel.
Ton débuggueur (Chrome ou autre) te sors peut-être une erreur ?

PS: effectivement no-js sur html, pas body, toutes mes plates...