Share Code Web - Chia sẻ niềm đam mê bất tận > Lập trình > Web Design > HTML/CSS > Facebook loading style với CSS
Facebook loading style với CSS
Nguyễn Trung Hiếu
Share Code Web Company 2012

Facebook loading style với CSS

Tiếp tục là một bài nữa, bài này sẽ hướng dẫn cách tạo kiểu loading giống với facebook, nhưng điều đặc biệt là chỉ sử dụng css thôi nhé.

Trên ShareCodeWeb cũng đã có khá nhiều bài viết về tạo trang loading sử dụng csshướng dẫn tạo ảnh load động bằng photoshop nhưng ở bài này mình sẽ hướng dẫn các bạn làm một kiểu loading khác giống với facebook nhìn rất cool. Và bài này mình sẽ không đưa demo bằng ảnh lên cho các bạn xem, hy vọng các bạn sẽ thấy tò mò mà thực hành để tự mình trải nghiệm với thành quả thì sẽ hay hơn.
OK. Bắt tay nào, File HTML của chúng ta rất đơn giản, chỉ gồm 2 thẻ div, một thẻ có id là wrapper và 1 thẻ có id là loader

Và css của chúng ta cũng rất đơn giản, chỉ gồm 2 phần, phần đầu là khởi tạo hình vẽ cho id loader

Phần 2 sẽ sử dụng sự hỗ trợ của CSS3 đó là keyframe để delay hình ảnh cho giống ảnh động nhé.

Vậy là xong, tận hưởng đi ^^.

Related Posts

Tác giả: Nguyễn Trung Hiếu

Một blogger ... cùi bắp! Đơn giản: tôi muốn ghi lại những gì xảy ra xung quanh, cả công việc lẫn cuộc sống và chia sẻ với các bạn đọc. Nếu bạn cảm thấy bài viết có nhiều điểm không chính xác, hãy comment và chia sẻ để tôi còn được học hỏi từ những góp ý của bạn. Email: hieunt.dcn@gmail.com

Leave a comment

Bạn phải Đăng nhập để tham gia bình luận.

https://sharecodeweb.net/?s={search_term_string}

Blog Stats

  • 6.246 hits
%d bloggers like this: