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