Bài jQuery 09: Hiệu ứng Slide trong jQuery

0
191

Xin chào các bạn, trong bài học ngày hôm nay mình sẽ giới thiệu đến các bạn hiệu ứng Slide trong jQuery.

Các phương thức jQuery slideUp() và slideDown()

Các phương thức slideUp()slideDown() được sử dụng để ẩn hoặc hiển thị các phần tử HTML bằng cách giảm dần hoặc tăng độ cao của chúng (tức là bằng cách trượt chúng lên hoặc xuống).

Ví dụ:

Giống như các phương thức hiệu ứng jQuery khác, bạn có thể tùy ý chỉ định tham số thời lượng hoặc tốc độ cho các phương thức slideUp()slideDown() để kiểm soát thời gian slide sẽ chạy. Thời lượng có thể được chỉ định bằng cách sử dụng một trong các chuỗi được xác định trước 'slow' hoặc 'fast' hoặc trong một số mili giây; giá trị cao hơn cho thấy hình ảnh động chậm hơn.

Ví dụ:

Bạn cũng có thể chỉ định một hàm callback được thực thi sau khi phương thức slideUp() hoặc slideDown() hoàn thành.

Phương thức slideToggle()

Phương thức jQuery slideToggle() hiển thị hoặc ẩn các phần tử đã chọn bằng cách kích hoạt độ cao của chúng theo cách mà nếu phần tử được hiển thị ban đầu, nó sẽ được trượt lên; nếu bị ẩn, nó sẽ được trượt xuống, tức là bật tắt giữa các phương thức slideUp()slideDown().

Ví dụ:

Tương tự, bạn cũng có thể chỉ định hàm callback cho phương thức slideToggle().

Kết luận

Như vậy trong bài học ngày hôm nay mình đã giới thiệu đến các bạn Hiệu ứng Slide trong jQuery. Trong bài học tiếp theo chúng ta sẽ cùng nhau tìm hiểu về Các hiệu ứng Animation trong jQuery.

Chúc các bạn học tập tốt!

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây