Animated selektory
:animated selektory häzirki wagtda animasiýada
gatnaşýan elementleri saýlaýar.
Eger siz effektler moduly bolmadyk ýörite jQuery ýygnamasy
ulanyan bolsaňyz, onda :animated-yň ulanylmasy
säwlik döreder. :animated CSS spesifikasiýasyna degişli
däl bolany üçin, häzirki brauzerlerde işleýş güýjini gowulandyrmak
üçin başda elementleri arassa css-selektory bilen süzgüçden geçirmek,
soňra bolsa .filter(':animated')-y ulanmak has gowy.
Sintaksis
Münä şeýlelikde biz animasiýada gatnaşýan elementleri saýlaýarys:
$(':animated');
Mysal
Geliň bir kwadratda animateIt funksiýasy
ýardymynda animasiýa işledilýän bolsun.
#change bilen düwmä her bir gezek basylanynda,
animirlenen kwadratyň reňki ýaşyl reňkden gyzyl reňke we yzyna
çalşyrylar - colored klasyny toggleClass
metody bilen aýyrmak we goşmak ýoly bilen:
<button id="change">üýtget</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();
Şeýle-de serediň
-
slideTogglemetodu,
gizlenen elementleri görkezýär we görkezilenleri gizleýär -
toggleClassmetodu,
CSS klasyny goşýar ýa-da aýyrýar -
findmetodu,
eýýäm tapylan elementleriň içinde elementleri gözleýär