Phương thức stop

Phương thức stop cho phép chúng ta ngay lập tức dừng hoạt ảnh đang chạy. Hoạt ảnh sẽ tiếp tục với hàm tiếp theo mà không cần chờ hoàn thành hàm trước đó.

Cú pháp

Cách chúng ta dừng hoạt ảnh đang chạy. Có thể truyền hai tham số tùy chọn, chấp nhận giá trị Boolean. Nếu thiết lập tham số đầu tiên là true, thì các hàm còn lại trong hàng đợi hoạt ảnh sẽ bị xóa và sẽ không bao giờ chạy. Nếu thiết lập tham số thứ hai là true, thì khi dừng hoạt ảnh, các thuộc tính css của phần tử sẽ ngay lập tức nhận giá trị cuối cùng của chúng (ví dụ, nếu mục tiêu là ẩn phần tử một cách mượt mà, thì nó sẽ bị ẩn ngay lập tức):

.stop([clearQueue], [jumpToEnd]);

Cũng có thể truyền một tham số tùy chọn, trong đó chỉ định tên hàng đợi:

.stop([tên hàng đợi], [clearQueue],[jumpToEnd]);

Có thể tắt hoạt ảnh toàn cục bằng cách sử dụng cài đặt jQuery.fx.off = true, thiết lập giá trị thời lượng thành 0.

Ví dụ

Hãy làm sao cho mỗi lần nhấp vào nút #toggle thì hình chữ nhật của chúng ta vừa mở rộng ra, vừa thu gọn lại bằng phương thức slideToggle. Nhấn vào nút mà không cần đợi hoạt ảnh hoàn thành - bước tiếp theo sẽ được chạy mà không cần chờ bước trước hoàn thành, nhờ vào phương thức stop:

<button id="toggle">toggle</button>
<div id="test"></div>

#test {
	background-color: green;
	border: 1px solid black;
	width: 200px;
	height: 100px;
	margin: 10px;
}

$('#toggle').on('click', function() {
	$('#test').stop().slideToggle(1500);
});

Xem thêm

phương thức clearQueue,
cho phép xóa tất cả các phần tử chưa thực hiện khỏi hàng đợi hàm
thuộc tính jQuery.fx.off,
cho phép tắt hoạt ảnh toàn cục