জেকুয়েরি dequeue() মেথড
সংজ্ঞা এবং ব্যবহার
dequeue() মেথড পরবর্তী ফাংশনকে রিমোভ করে, তারপর মূল ফাংশনটি এক্সিকিউট করে।
পরবর্তী ফাংশন বলতে এক্সিকিউশনের জন্য অপেক্ষাকারী ফাংশনকে বুঝায়।
dequeue() মেথড queue() মেথডের সাথে একত্রে ব্যবহার করা হয়।
নোটঃ আপনাকে এটা নিশ্চিত করতে হবে যে, queue() মেথডের মাধ্যমে একটি ফাংশন যুক্ত করার পর যেন dequeue() মেথড কল করা হয়।
সিনট্যাক্সঃ
$(selector).dequeue(queueName)
প্যারামিটার ও তাদের ভ্যালু
নিচের টেবিলে dequeue() মেথডে ব্যবহৃত প্যারামিটার এবং প্যারামিটারের সম্ভাব্য ভ্যালু গুলো দেখানো হলোঃ
| প্যারামিটার | বিবরণ |
|---|---|
| queueName | ঐচ্ছিক। সারিকৃত ফাংশনের নামকে নির্দেশ করে। ডিফল্ট হলো স্ট্যান্ডার্ড ইফেক্ট সারি "fx"। |
dequeue() মেথড সংক্রান্ত উদাহরণ
পরবর্তী ফাংশনকে রিমোভ করে, তারপর মূল ফাংশনটি এক্সিকিউটঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>জেকুয়েরি উদাহরণ</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#startAnimation").click(function(){
var div = $("div");
div.animate({height: 300}, "slow");
div.animate({width: 300}, "slow");
div.queue(function () {
div.css("background-color", "red");
div.dequeue();
});
div.animate({height: 100}, "slow");
div.animate({width: 100}, "slow");
});
});
</script>
</head>
<body>
<p>queue() মেথড ফাংশনের একটি সারি(queue) তৈরি করে, যা নির্বাচিত এলিমেন্ট এক্সিকিউট হবে।</p>
<p>dequeue() মেথডের মাধ্যমে ঐ ফাংশনগুলোকে সারি অনুযায়ী এক্সিকিউট করে।</p>
<p><button id="startAnimation">এ্যানিমেশন শুরু করুন</button></p>
<div style="background:blue;height:100px;width:100px;">
</div>
</body>
</html>
ফলাফল
একত্রে queue রিলেটেড মেথডের ব্যবহার
কিভাবে queue(), dequeue() এবং clearQueue() মেথড একত্রে ব্যবহার করা যায় তা নিচের উদাহরণে দেখানো হলোঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>জেকুয়েরি উদাহরণ</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var div = $("div");
$("#startAnimation").click(function(){
div.animate({height: 300}, "slow");
div.animate({width: 300}, "slow");
div.queue(function () {
div.css("background-color", "red");
div.dequeue();
});
div.animate({height: 100}, "slow");
div.animate({width: 100}, "slow");
});
$("#stopAnimation").click(function(){
div.clearQueue();
});
});
</script>
</head>
<body>
<p>queue() মেথড ঐ ফাংশনগুলোকে সরবরাহ করে, যেগুলো নির্বাচিত এলিমেন্টে এক্সিকিউট হবে।</p>
<p>dequeue() মেথড সারিকৃত ফাংশনগুলোকে রিমোভ করে এবং মূল ফাংশনটি এক্সিকিউট করে।</p>
<p>clearQueue() মেথড যে ফাংশনগুলো এখনো রান হয়নি সেগুলোকে রিমোভ করে।<p>
<p>
<button id="startAnimation">এনিমেশন শুরু করুন</button>
<button id="stopAnimation">এনিমেশন বন্ধ করুন</button>
</p>
<div style="background:#98bf21;height:100px;width:100px;position:relative"></div>
</body>
</html>
ফলাফল