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:

javascript$(':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:

html<button id="change">değiştir</button>

<div></div>
<div id="test"></div>
cssdiv {
  background: green;
  border: 1px solid #AAA;
  width: 80px;
  height: 80px;
  margin: 0 5px;
  float: left;
}
div.colored {
  background: red;
}
javascript$('#change').click(function() {
  $('div:animated').toggleClass('colored');
});

function animateIt() {
  $('#test').slideToggle('slow', animateIt);
}

animateIt();

Ayrıca Bakınız

  • slideToggle yöntemi,
    gizli öğeleri gösterir ve görünür öğeleri gizler
  • toggleClass yöntemi,
    bir CSS sınıfı ekler veya kaldırır
  • find yöntemi,
    zaten bulunmuş öğelerin içinde başka öğeler arar