Closed LeHibou closed 12 years ago
1) This is done in your CSS:
.step { opacity: 0.3; } /* All steps are faded out */
.step.active { opacity: 1; } /* The active step is faded in */
2) The easiest way to apply animations, imo, is to do animations in your CSS and use the data-jmpress
attribute to trigger them. Here is an example: http://shama.github.com/jmpress.js/examples/animation/#/basic
Or you could use jQuery.animate within the code you have above. There are a lot of CSS and jQuery animations out there via a google search. Here is a good CSS based one: http://daneden.me/animate/
Ok, so I forget the story of jquery events ? (I am not a pro, just a code-struggling-guy-who-would-rather-prefer-to-go-to-the-beach)
And start the animation the easy way.
Thanks Shama
I'm not a pro either... although @sokra is ;)
Closing. Just let us know if you have any issues with animations. Thanks!
Hi,
i have got two questions :
1) how could we manage to have the opacity down of non focused elements, like http://bartaz.github.com/impress.js/#/step-2 ?
2) I would like to move elements on the page when leaving the step :
How could I animate a div with this code ? $('#mydiv') .on('enterStep', function(event) { what should be put here to animate my div called #toto ? }) .on('leaveStep', function(event) { what should be put here to animate my div called #toto ? });
Many thanks,
LeHibou