after hidden, animation does not restart
HTML
<img class="bulge" src="http://placehold.it/200x200" />
CSS
@-webkit-keyframes imagebulger {
to {
-webkit-transform: scale(.75);
transform: scale(.75);
}
}
@keyframes imagebulger {
to {
-webkit-transform: scale(.75);
transform: scale(.75);
}
}
img.bulge {
-webkit-animation: imagebulger 1.4s infinite alternate;
-moz-animation: imagebulger 1.4s infinite alternate;
-o-animation: imagebulger 1.4s infinite alternate;
animation: imagebulger 1.4s infinite alternate;
}
JavaScript
setTimeout(function () {
//$("img").css('visibility', 'hidden');
$("img").removeClass("bulge");
activate();
}, 3000);
function activate() {
setTimeout(function () {
$("img").css('visibility', 'visible');
$("img").addClass("bulge");
}, 3000);
}