animated Seçici
:animated seçicisi, şu anda bir animasyonda
kullanılan öğeleri seçer.
Efekt modülü olmadan özel bir jQuery derlemesi
kullanıyorsanız, :animated kullanımı
bir hataya neden olacaktır. :animated
CSS spesifikasyonuna ait olmadığı için, modern
tarayıcılarda performansı artırmak amacıyla,
önce öğeleri saf bir css seçicisi kullanarak
filtrelemek ve ardından .filter(':animated')
uygulamak daha iyidir.
Sözdizimi
Animasyonda kullanılan öğeleri şu şekilde seçeriz:
$(':animated');
Örnek
animateIt fonksiyonu kullanılarak karelerden birinde
bir animasyon başlatılmasını sağlayalım.
#change kimliğine sahip butona her tıklandığında,
animasyonu devam eden karenin rengi, colored sınıfının
toggleClass
yöntemiyle eklenip kaldırılması yoluyla yeşilden kırmızıya ve
tersi şekilde değişecektir:
<button id="change">değiştir</button>
<div></div>
<div id="test"></div>
div {
background: green;
border: 1px solid #AAA;
width: 80px;
height: 80px;
margin: 0 5px;
float: left;
}
div.colored {
background: red;
}
$('#change').click(function() {
$('div:animated').toggleClass('colored');
});
function animateIt() {
$('#test').slideToggle('slow', animateIt);
}
animateIt();
Ayrıca Bakınız
-
slideToggleyöntemi,
gizli öğeleri gösterir ve görünür öğeleri gizler -
toggleClassyöntemi,
bir CSS sınıfı ekler veya kaldırır -
findyöntemi,
zaten bulunmuş öğelerin içinde başka öğeler arar