Tạo preloader tuyệt đẹp với Loader.css

GIỚI THIỆU

Loader.css là một bộ sưu tập preloader tuyệt vời dành cho website của bạn, nếu website của bạn phải thực hiện nhiều tác vụ mất nhiều thời gian chờ đợi xử lý thì Loader là một giải pháp làm giảm bớt sự nhàm chán cho người dùng với rất nhiều hiệu ứng đẹp và độc đáo.

HƯỚNG DẪN SỬ DỤNG

Thông thường

• Thêm loaders.min.css
• Tạo thẻ div và sử dụng các class animation tương ứng (e.g. <div class="loader-inner ball-pulse"></div>)
• Thêm thẻ <div>s bên trong với số lượng tương ứng với từng loại chuyển động

jQuery (Tùy chọn)

• Thêm loaders.min.css, jQuery, và loaders.css.js
• Tạo thẻ div và sử dụng các class animation tương ứng (e.g. <div class="loader-inner ball-pulse"></div>)
• loaders.js cho phép thêm đúng số lượng thẻ div(s) con tùy thuộc từng loại chuyển động

DEMO

See the Pen loader.css by Thanh Nguyen (@genievn) on CodePen.

TÙY BIẾN

Thay đổi màu nền

Thêm styles vào đúng thẻ div của từng loại chuyển động

.ball-grid-pulse > div: {
  background: orange;
}