Animate

Animate

HTML

<div id="filters">
<button id="filter-berry">Toggle berry flavors</button>
<!-- <button id="filter-citrus">Toggle citrus</button> -->
</div>

Jquery

 $('#filter-berry').click(function(e) {
        e.preventDefault();
        $('#cart-water').find('.berry')
            .animate({
                'margin-left': '50',
                'height': '70',
                'opacity': '.5',
                'font-size': '120%'

            }, 3000, 'easeInOutElastic');
    });

// you can also add a callback function that runs after the animation.
}, 3000,easeInOutElastic, function(){
 $(this).remove();
});
// you have to install jquery UI to get the Easein functiolality

http://easings.net/ Different ease animations]

Back To Top< — >Category< — > Home