متد stop( [clearQueue, gotoEnd ]) در jQuery

دسته بندی : آموزش jQuery سطح مقاله : متوسط زمان مطالعه : 3 دقیقه آخرین بروز رسانی: 09 شهریور 1401

متد stop( [clearQueue, gotoEnd ]) در jQuery در این مقاله از سری مقالات آموزش جی کوئری دویکس بررسی می‌شود. متد stop( [clearQueue, gotoEnd ]) تمام انیمیشن‌های در حال اجرا را روی تمام عناصر مشخص شده متوقف می‌کند.

ساختار متد stop( [clearQueue, gotoEnd ]) در jQuery

در اینجا نحو و ساختار ساده برای استفاده از این متد آمده است:

selector.stop( [clearQueue], [gotoEnd] ) ;

پارامترهای متد

در اینجا تمام پارامترهای استفاده شده توسط این متد توضیح داده شده است:

clearQueue : این پارامتر بولی اختیاری است؛ وقتی روی true تنظیم شود، صف انیمیشن را پاک می‌کند و به طور موثر تمام انیمیشن‌های در صف را متوقف می‌کند
gotoEnd : این پارامتر بولی اختیاری است؛ یک Boolean (true/false) که وقتی روی true تنظیم شود باعث می‌شود انیمیشن در حال پخش بلافاصله کامل شود، شامل بازنشانی سبک‌های اصلی در نمایش، پنهان کردن و فراخوانی تابع callback

مثال

در قطعه کد زیر یک مثال ساده آورده شده است که استفاده از این روش را نشان می‌دهد:

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "https://www.tutorialspoint.com/jquery/jquery-3.6.0.js">
      </script>
		
      <script type = "text/javascript" language = "javascript">
   
         $(document).ready(function() {

            $("#go").click(function(){
               $(".target").animate({left: '+=100px'}, 2000);
            });

            $("#stop").click(function(){
               $(".target").stop();
            });

            $("#back").click(function(){
               $(".target").animate({left: '-=100px'}, 2000);
            });
				
         });
      </script>
		
      <style>
         p {background-color:#bca; width:250px; border:1px solid green;}   
         div{position: absolute; left: 50px; top:300px;}
      </style>
   </head>
	
   <body>
      <p>Click on any of the following buttons:</p>
		
      <button id = "go"> GO</button>
      <button id = "stop"> STOP </button>
      <button id = "back"> BACK </button>

      <div class = "target">
         <img src = "/jquery/images/jquery.jpg" alt = "jQuery" />
      </div>
   </body>
</html>

این مقاله در اینجا به پایان رسید، امیدواریم از مطالعه آن لذت برده باشید. برای دسترسی به لیست کامل متدهای اعمال جلوه‌های خاص در jQuery به مقاله بررسی جلوه‌‌ها (Effects) در jQuery مراجعه کنید.

این مقاله چقدر براتون مفید بود؟

اولین امتیاز را ثبت کنید😊