Understanding CSS3 Animations - Part 2

Here is little snippet for your help:

JQuery - CSS3 Animation:

$('#cardText').addClass('initialize');

$("#btnTest").bind('click', testCSS);

//alert("After: " + $("#cardText").attr("class"));

function testCSS()

{

$('#cardText').toggleClass('sizeInCard');

}

CSS3 Styles:

#cardText{

position: absolute;

height: 100px;

left: 300px;

top: 120px;

background-color:red;

color:white;

font-weight:800;

}

.initialize {width: 400px;-webkit-transition: width 2s linear;}

.sizeOutCard {width: 400px; -webkit-transition: width 2s linear;}

.sizeInCard {width: 0px; -webkit-transition: width 10s linear;}