16/2/15
snabbt.js - Tạo DOM/Text animation đơn giản
16/2/15
Từ khi HTML5 xuất hiện, việc sử dụng JavaScript và CSS3 để tạo Animate đã trở thành phổ biến. Tạo Animate có rất nhiều dạng, phức tạp thì cần phải sử dụng hoạt cảnh, đơn giản thì chỉ là các thao tác với DOM/Text.
Hôm nay, mình xin giới thiệu việc tạo Animate đơn giản sử dụng snabbt.js. Khi click hoặc rê chuột thì sẽ tạo ra Animate đơn giản.
Cách sử dụng snabbt.js
Nếu sử dụng snabbt.js thì không cẩn phải sử dụng các hình hoạt cảnh mà vẫn có thể tạo được những chuyển động với thao tác của người dùng. Có thể sử dụng với jQuery hoặc độc lập. Ví dụ sau không sử dụng jQuery.
Nếu sử dụng MethodChain thì có thể tạo nhiều Animate liên tục.snabbt(element, { position: [100, 0, 0], rotation: [Math.PI, 0, 0], duration: 1000, delay: 100, easing: 'ease' });
Với snabbt.js thì việc tạo Animate không cần phải code nhiều dòng phức tạp, mà code lúc đó sẽ dễ đọc dễ hiểu hơn phải không.snabbt(element, { position: [100, 0, 0], easing: 'ease' }).then({ from_rotation: [0, 0, -2*Math.PI], easing: 'spring', spring_constant: 0.2, spring_deaccelaration: 0.95, });
snabbt.js là chương trình bằng JavaScript, mã nguồn mở dưới MIT License.
Liên kết:
snabbt.js
snabbt.js
daniel-lundin/snabbt.js
Bài Viết Liên Quan
Đăng ký:
Đăng Nhận xét
(
Atom
)
0 nhận xét “ snabbt.js - Tạo DOM/Text animation đơn giản ”
Đăng nhận xét