Grow your CSS skills. Land your dream job.

AnythingSlider: Different animation for each slide.

  • # February 1, 2013 at 6:50 am

    Hello, I’am currently helping a friend work out his problem with the slider and we cannot achieve what is needed. So what i was wondering is there anyway of making each slide enter with one animation and leave with another.

    So say one comes in from the left then leaves through the top? I’ve searched countless posts and found nothing that i could wrap my head around to get working. So a little bit of help would be much appreciated.

    Many thanks.

    # February 1, 2013 at 9:05 am

    Hi Volitle!

    Well, it’s not built into AnythingSlider, but the FX extension can do this for you:

    1) Use the [FX extension](http://css-tricks.github.com/AnythingSlider/demos.html) and target the entire panel to move it in the direction you desire. You can use the [AnythingSlider FX Builder](http://css-tricks.github.com/AnythingSlider-Fx-Builder/) bookmarklet if you need help with the code.

    2) Use the FX extension with the (css3) [animate.css](http://daneden.me/animate/) library to add some really cool transitions. Check out [this demo](http://css-tricks.github.com/AnythingSlider/css3.html).

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".