জেকুয়েরি Stop এনিমেশন
এনিমেশন অথবা অন্য যে কোন ইফেক্ট শেষ হওয়ার পূর্বেই বন্ধ করে দেয়ার জন্য জেকুয়েরি stop()
মেথড ব্যবহার করা হয়।
প্যানেলকে উপর/নিচ স্লাইড করার জন্য ক্লিক করুন
সময়ের মূল্য অনেক বেশি হওয়ায় আমরা ছোট এবং সহজ পাঠের ব্যবস্থা করেছি।
আপনার প্রয়োজনীয় সব কিছুই স্যাট একাডেমীতে খুব সহজ এবং উপযোগী ফরম্যাটে উপস্থাপন করা হয়েছে যেন আপনি সহজে শিখতে পারেন।
জেকুয়েরি stop() মেথড
এনিমেশন অথবা অন্য যে কোন ইফেক্ট শেষ হওয়ার পূর্বেই বন্ধ করে দেয়ার জন্য জেকুয়েরি stop()
মেথড ব্যবহার করা হয়।
stop()
মেথড জেকুয়েরির সকল ইফেক্ট ফাংশনের জন্য কাজ করে। যার মধ্যে স্লাইডিং, ফেইডিং এবং কাস্টম এনিমেশন রয়েছে।
সিনট্যাক্স:
$(selector).stop(stopAll,goToEnd);
অতিরিক্ত stopAll প্যারামিটারের মাধ্যমে এনিমেশন সারি(queue) বাদ দেয়া হবে কিনা নির্ধারণ করা হয়। এর ডিফল্ট ভ্যালু হলো false যার অর্থ হলো একটিভ এনিমেশনটি বন্ধ হয়ে যাবে এবং সারিভুক্ত অন্য এনিমেশনগুলো সম্পাদিত হবে।
অতিরিক্ত goToEnd প্যারামিটারের মাধ্যমে চলমান এনিমেশনটি সম্পন্ন হবে কিনা নির্ধারণ করা হয়। ডিফল্ট ভ্যালু হলো false ।
তাহলে আমরা এটা নিশ্চিত হলাম যে, stop()
মেথড ডিফল্টভাবে নির্বাচিত এলিমেন্টের চলমান এনিমেশন ইফেক্টটিকে বন্ধ করে দেয়।
নিচে stop()
মেথডের উদাহরণ দেখানো হলো (প্যারামিটার ব্যতীত):
উদাহরণ
<!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(){
$("#flip").click(function(){
$("#panel").slideDown(4000);
});
$("#close").click(function(){
$("#panel").stop();
});
});
</script>
<style>
#panel #flip {
padding: 5px;
font-size: 18px;
text-align: center;
background-color: aqua;
color: white;
border: solid 1px teal;
border-radius: 3px;
}
#panel {
padding: 40px;
display: none;
}
</style>
</head>
<body>
<button id="close">স্লাইডিং বন্ধ করুন</button>
<div id="flip">স্লাইড ডাউন প্যানেলের জন্য ক্লিক করুন</div>
<div id="panel">স্যাট একাডেমীর সাথেই থাকুন</div>
</body>
</html>
ফলাফল
জেকুয়েরি ইফেক্ট রেফারেন্স
জেকুয়েরি ইফেক্টের সম্পূর্ণ রেফারেন্সের জন্য আমাদের জেকুয়েরি ইফেক্ট রেফারেন্স পেজে ভিজিট করুন।