Vous pensiez que les mot zoom-in, zoom-out, fade, slide up, slide down et autres était reservé au effet pour le smontage vidéo ?
Et bien non ! Grace à Thomas Fuchs vous pourrez animé n'importe quel objet de vos page HTML avec une simplicité étonnante !
!!Note: Pour faire réaparaitre l'image, utilisez l'effet Effect.Appear !!
Voir l'effet Effect.Appear
Voir l'effet Effect.Fade
Voir l'effet Effect.Puff
Voir l'effet Effect.BlindDown
Voir l'effet Effect.BlindUp
Voir l'effet Effect.SwitchOff
Voir l'effet Effect.SlideDown
Voir l'effet Effect.SlideUp
Voir l'effet Effect.DropOut
Voir l'effet Effect.Shake
Voir l'effet Effect.Pulsate
Voir l'effet Effect.Squish
Voir l'effet Effect.Fold
Voir l'effet Effect.Grow
Voir l'effet Effect.Shrink
Voir l'effet Effect.Highlight
Voir l'effet Effect.toggle

Pour utiliser les effets, ils vous faut 2 fichiers :
Pour utiliser un effet, rien de plus simple :
Tous d'abord, déclarez les fichier javascript dans la section <head> de votre page :
<head> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="effects.js"></script> </head>
!!important : veillez a respecter l'ordre ! D'abord prototype puis effects…!!
Maintenant que les effets sont chargé dans votre page, pour les utilisez, il suffit d'appeler la fonction Effect.XXXXX où XXXXX correspond au nom d'un effet.
Exemple :
new Effect.Shrink(document.getElementById('demo-all'));
— iDo 07/02/2006 09:50
Discussion
Bonjour peut on agir sur plusieurs objets a la fois en utilisant le code ci dessus , car apres avoir fait le test on peut agir que sur un seul objet si vous avez une astuces ??? merci de m’aider ;)
Salut, on peu en effet agir sur plusieurs objets
Mais il me faudrais un peu plus de détail pour pouvoir t’aider.
Peut tu coller sur le pastebin un exemple de ce que tu veux faire ?
++
Bonjour, Comment peut-on vérifier l’état de notre élément, c’est à dire comment peut-on savoir si il est visible ou non ? Merci d’avance.
Tu peux vérifier si ton element est affiché avec du javascript en utilisant une condition if (document.getElementById(‘monId’).display==‘block’) {}
Bonjour
J'ai un petit soucis a utiliser les sytème.
J'ai sans cess ma concole javascript qui me dit Effect is not defined
Hors je défini bien les deux js en head.
Voici mon code:
Merci
salut,
la seule raison que je vois c'est que le chemin vers les deux fichier js n'est pas correct…
A part pour Highlight (de ce que je me souviens), il ne faut pas écrire new Effet.XXXX mais seulement Effect.XXX
SALUT LES SAVANT AIDEZ MOI, JE DEBUTE EN JAVASCRIPT,mon souhait est de prendre le contrôle des navigateurs chez le client et animez les objets de la page car je travaille déja avec PHP comme il s'execute cote serveur j'ai besoin des EXEMLPES CONCRETs avec javascript
Tu en demande bcp… surtout en débuttant.. tu devrais d'abort suivre quelque tutoriel…
Bonjour, Je souhaiterai enchainé deux foncions mais je ne trouve pas comment faire … voila a quoi ressemble ma fonction : function disparition (){
new Effect.SlideUp(document.getElementById('corpspage')); /* faire disparaitre l'élément 'corpspage' /* ici je vodrais coder une pause ou une vérification que l'élément 'corpspage' est invisible*/ new Effect.SlideDown(document.getElementById('corpspage')); /* Ici le faire réapparaitre avec de nouvelle données */ };Merci d'avance de votre aide Cordialement
Salut,
avant tout, c'est une très bonne bibliothèque! félicitation.
J'aimerai juste faire quelques remarques;
1- Serait-il envisageable d'envoyer au constructeur de la classe Effect un tableau d'élément? typiquement le résultat d'un [CODE]$$('div.monStyle')[/CODE]sinon rien signaler pour le moment :o)
encore merci.
Salut
j'ai mis en en place des effets sur plusieurs object à la fois sous FF tous fonctionne correctement
mais sous ie les effets ne se font pas
et je n'ai pas d'erreur js je pense que c'est le point n°2 du topic ci-dessus
Bonjour, je viens de mettre en place l'effet toggle de scriptaculous sur mon site.
Il fonctionne très bien je dois dire et me convient parfaitement.
Mais j'aurais aimé savoir s'il était possible d'enregistrer les états des éléments dans un cookie ou une session.
En fait cela me sert à cacher/montrer mon menu latéral. mais j'aurais voulu que le menu reste dans la même position d'une page à l'autre.
A mon avis en enregistrant un cookie, ça doit être possible, mais n'étant pas un pro en JS, j'ai un peu de mal.
Oups, pardon, ce n'est pas Scriptaculous. -_-'
C'est Prototype (au passage, ça m'a l'air plus léger). :)
J'en reviens à ma question: Pense-vous qu'il soit possible d'enregistrer les données dans un cookie pendant le onclick ?
Car j'utilise l'effet dans mon menu, mais aussi dans mes pages, en passant par une fonction.
Salut,
Tu peux tout à fait l'enregistrer dans un cookie :)
Voila 2 fonctions qui vont t'y aider : gerer facilement les cookies
bonjour j'utilise SlideDown et SlideUP comment faire pour faire disparaître le lien ouvrir quand la div et ouverte et le lien fermer quand la div est fermé ?
<a href=”#” onclick=“Effect.SlideDown('nouveaut'); return false;”>Ouvrir</a> | <a href=”#” onclick=“Effect.SlideUp('nouveaut'); return false;”>Fermer</a>
génial, merci !
bjr j'ai fais un essai exemple
<head>
<script type=“text/javascript” src=“effects.js”></script> <script language=“Javascript”>
new Effect.Appear(document.getElementById('photo')); </script> <style> #photo{ display:none; } </style> </head> <body> <div id="photo"> <img src="image1_big.jpg" width="500" height="375"> </div>il me mets une erreur :element is null ai je fais une erreur??? merci de m'aider svp!!!
Bonjour,
Je ne sais pas si tu as résolu ton soucis. Mais il faut que tu mettes ta ligne :
<script language=“Javascript”> Effect.Appear(document.getElementById('photo')); </script>
à la fin de ton code. En effet, dans ton script il execute l'affichage de ta photo alors qu'il n'a pas encore lu le reste de la page…
Re bonjour à tous,
J'ai un petit soucis lorsque je fais tourner ce script sur internet explorer (et il faut que mon site soit compatible avec ie …) : Lorsque j'imbrique plusieurs div qui se déplie avec BlindDown/Up, lorsque l'on plie un div, il y a un léger artéfact : il le replie normalement puis il l'affiche en entier puis il le fait disparaitre. cela se passe très vite mais ça ne fait pas propre. Est que quelqu'un aurait déjà eu ce problème ?
Merci de vos réponses !
Nicolas
Bonjour, Merci pour cette page, ca m'a bien aidé. Est-il normal que certains effets ne fonctionnent pas bien sur Safari? Exemple : l'effet pulsate ne rend pas du tout pareil…
François
Hello,
Il y a un bug généralisé sur tous les effets sous Firefox and IE 7, IE 8. Lorque qu'on lance un effet alors qu'il y en déjà un en cours. (Via un bouton par exemple)
Détails de l’erreur de la page Web:
Message : Impossible d'obtenir la propriété overflow. Argument non valide. Ligne : 1013 Caractère : 5 Code : 0 URI :js/prototype.js
Du coup ce script devient inutilisable.
Bon courage
Highkickx
Bonjour, j'ai juste une petite question concernant le style.display d'un élément, par défaut je souhaiterais que le toggle soit fermé (pas affiché). Mon idée était de définir dans l'objet element le Element.style.display= none, mais ça fonctionne pas. J'avais comme idée d'inverser le hide et le show dans Element[Element.visible(element) ? 'hide' : 'show'](element) (ligne 857 de prototype.js).
Pourriez-vous simplement m'indiquer la ligne du fichier à modifier? Merci d'avance
Bonjour,
Tout d'abord, je tiens à vous remercier pour ce flots d'effets mais également pour m'avoir fait découvrir prototype.
J'ai une petite question.
Comment faire afin de pouvoir enchaîner 2 voire 3 effets en ne cliquant qu'une seule fois. Le but étant de pouvoir faire par exemple un slide up sur une div et dans la foulée faire un slide dows en ayant modifié le contenu entre temps.
En espérant avoir été assez clair et précis,
Par avance merci
Sébastien
Bonjour,
Magnifique effet et merci pour la disponibilité du code. Petite question “Est-ce que l'effet SlideDown est modifiable facilement pour creer SlideRight”