jQuery kütüphanesini kullanarak uygulamalarımıza çoklu animasyon uygulama örneğimiz.
İlgili JavaScript betiğimiz.
$(document).ready(function () {
$(".buton").click(function () {
$(".yazi").animate({ "font-size": "40px" }, "slow")
.animate({ "font-size": "15px" }, "slow")
.animate({ "font-size": "40px" }, "slow")
.animate({ "font-size": "15px" }, "slow");
});
});
İlgili Css betiğimiz.
.yazi{width:100px;height:40px;color:#144E56;font-size:15px;line-height:40px;font-family:Tahoma;padding:5px;}
.buton{background-color:#F3F3F3;color:#144E56;border:1px solid #B9B9B9;font-family:"Verdana", Lucida Grande, Tahoma, Arial, sans-serif;font-size:12px;padding:6px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;cursor:pointer;}
.buton:hover{background-color:#B9B9B9;}
Body etiketleri arasına katacağımız elementler.
<button class="buton">Animasyonu Uygula</button>
<p class="yazi">www.ontedi.com</p>
