animated সিলেক্টর

:animated সিলেক্টরটি এমন উপাদানগুলিকে নির্বাচন করে যা বর্তমানে অ্যানিমেশনে জড়িত। যদি আপনি ইফেক্ট মডিউল ছাড়া কাস্টম jQuery বিল্ড ব্যবহার করেন, তাহলে :animated ব্যবহার করলে একটি ত্রুটি ঘটবে। যেহেতু :animated CSS স্পেসিফিকেশনের অংশ নয়, তাই আধুনিক ব্রাউজারে কার্যকারিতা উন্নত করার জন্য প্রথমে খাঁটি CSS সিলেক্টর ব্যবহার করে উপাদানগুলি ফিল্টার করা ভাল, এবং তারপর .filter(':animated') প্রয়োগ করুন।

সিনট্যাক্স

এভাবে আমরা অ্যানিমেশনে জড়িত উপাদানগুলি নির্বাচন করি:

javascript$(':animated');

উদাহরণ

আসুন একটি বর্গক্ষেত্রে animateIt ফাংশন ব্যবহার করে একটি অ্যানিমেশন চালু করি। #change সহ বাটনে প্রতিটি ক্লিকে অ্যানিমেটেড বর্গক্ষেত্রের রঙ সবুজ থেকে লাল এবং পিছনে পরিবর্তিত হবে - toggleClass পদ্ধতি দ্বারা colored ক্লাস সরিয়ে এবং যোগ করে:

html<button id="change">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 পদ্ধতি,
    যা ইতিমধ্যে পাওয়া উপাদানগুলির ভিতরে উপাদানগুলি খুঁজে বের করে