animated අනුචේතකය

:animated අනුචේතකය මෙම මොහොතේ සජීවිකරණයට සම්බන්ධ වූ අංග තෝරා ගනී. ඔබ බලපෑම් මොඩියුලය නොමැතිව අභිරුචි jQuery සම්පාදනය භාවිතා කරන්නේ නම්, :animated භාවිතා කිරීම දෝෂයක් ඇති කරවයි. :animated CSS ප්‍රමිතියට අයත් නොවන බැවින්, නවීන බ්‍රවුසරවල කාර්ය සාධනය වැඩිදියුණු කිරීම සඳහා පළමුව pure css-අනුචේතකය භාවිතයෙන් අංග පෙරහන් කර, ඉන්පසු .filter(':animated') යෙදීම වඩා හොඳය.

වාක්‍ය රීතිය

මේ ආකාරයට අපි සජීවිකරණයට සම්බන්ධ වූ අංග තෝරා ගනිමු:

javascript$(':animated');

උදාහරණය

එක් කොටුවක් මත animateIt ශ්‍රිතය භාවිතයෙන් සජීවිකරණයක් ආරම්භ කරමු. #change සමඟ බොත්තම ක්ලික් කරන සෑම විටම සජීවිකරණය කරන ලද කොටුවේ වර්ණය හරිතයේ සිට රතු බවටත් අනෙක් අතටත් වෙනස් වේ - colored වර්ගය ඉවත් කිරීමෙන් සහ එකතු කිරීමෙන් toggleClass ක්‍රමය මගින්:

html<button id="change">වෙනස් කරන්න</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();

තවද බලන්න

  • slideToggle ක්‍රමය,
    සැඟවුණු අංග පෙන්වන අතර පෙන්වන ලද අංග සඟවයි
  • toggleClass ක්‍රමය,
    CSS වර්ගයක් එකතු කරන හෝ ඉවත් කරන
  • find ක්‍රමය,
    දැනටමත් සොයාගත් අංග තුළ අංග සොයයි