Thuộc tính transitionProperty của Style
- Trang trước transition
- Trang tiếp theo transitionDuration
- Quay lại lớp trên Đối tượng Style HTML DOM
Định nghĩa và cách sử dụng
transitionProperty
Thuộc tính quy định tên thuộc tính CSS mà hiệu ứng chuyển đổi nhắm đến (hiệu ứng chuyển đổi sẽ bắt đầu khi thuộc tính CSS được chỉ định thay đổi).
Lưu ý:Khi người dùng đặt con trỏ chuột lên phần tử, thường sẽ xuất hiện hiệu ứng chuyển đổi.
Ghi chú:Luôn quy định Thuộc tính transitionDurationnếu không, thời gian duy trì sẽ là 0, hiệu ứng chuyển đổi sẽ không có hiệu lực.
Xem thêm:
Hướng dẫn CSS:Thuộc tính transition-property
Mô hình
Đặt con trỏ chuột lên phần tử div để thay đổi dần chiều rộng và chiều cao:
document.getElementById("myDIV").style.transitionProperty = "width,height";
Cú pháp
Trả về thuộc tính transitionProperty:
object.style.transitionProperty
Đặt thuộc tính transitionProperty:
object.style.transitionProperty = "none|all|property|initial|inherit"
Giá trị thuộc tính
Giá trị | Mô tả |
---|---|
none | Không có thuộc tính nhận được hiệu ứng chuyển đổi. |
all | Giá trị mặc định. Tất cả các thuộc tính sẽ nhận được hiệu ứng chuyển đổi. |
property | Danh sách tên thuộc tính CSS định nghĩa hiệu ứng chuyển đổi, phân cách bằng dấu phẩy. |
initial | Đặt thuộc tính này về giá trị mặc định. Xem thêm initial. |
inherit | Thừa kế thuộc tính này từ phần tử cha. Xem thêm inherit. |
Chi tiết kỹ thuật
Giá trị mặc định: | all |
---|---|
Giá trị trả về: | Chuỗi biểu thị Thuộc tính transition-property. |
Phiên bản CSS: | CSS3 |
Hỗ trợ trình duyệt
Số liệu trong bảng đã ghi chú phiên bản trình duyệt đầu tiên hỗ trợ thuộc tính này hoàn toàn.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
26.0 | 10.0 | 16.0 | 6.1 | 12.1 |
- Trang trước transition
- Trang tiếp theo transitionDuration
- Quay lại lớp trên Đối tượng Style HTML DOM