NTM Solutions

Facebook Youtube Google+

Thứ Tư, 25 tháng 1, 2017

Tự học JQuery - Hiệu Ứng - Bài 3 – Trượt

Phương thức Sliding

Với jQuery bạn có thể tạo 01 hiệu ứng trượt trên phần tử.
jQuery có các phương thức sau mô tả hiệu ứng trượt:
  • slideDown()
  • slideUp()
  • slideToggle()

Phương thức slideDown()

Phương thức slideDown() dùng để trượt xuống 01 phàn tử.
Cú pháp::
$(selector).slideDown(speed,callback);
Tham số speed xác định thời lượng hiệu ứng diễn ra. Bao gồm các giá trị sau: "slow", "fast", hoặc milliseconds.
Tham số callback là 01 hàm được thực thi sau khi hiệu ứng trượt hoàn thành.

Ví dụ:

$("#flip").click(function(){
    $(
"#panel").slideDown();
});

Phương thức slideUp()

Phương thức slideUp() dùng để trượt lên 01 phần tử.
Cú pháp:
$(selector).slideUp(speed,callback);
Tham số speed xác định thời lượng của hiệu ứng. Bao gồm các giá trị sau: "slow", "fast", hoặc milliseconds.
Tham số callback là 01 hàm được thực thi sau khi hiệu ứng hoàn thành.

Ví dụ:

$("#flip").click(function(){
    $(
"#panel").slideUp();
});

Phương thức slideToggle()

Phương thức slideToggle() bật/tắt giữa 02 phương thức slideDown() và slideUp().
Nếu phần tử đang trượt xuống thì nó sẽ trượt lên và ngược lại.
$(selector).slideToggle(speed,callback);
Tham số speed gồm các giá trị sau: "slow", "fast", milliseconds.
Tham số callback là 01 hàm được thực thi sau khi hiệu ứng trượt hoàn thành.

Ví dụ:

$("#flip").click(function(){
    $("#panel").slideToggle();
});