Share Code Web - Chia sẻ niềm đam mê bất tận > Share code web > Hướng dẫn tạo Arrowed sidebar menu bằng css
Hướng dẫn tạo Arrowed sidebar menu bằng css
Nguyễn Trung Hiếu
Share Code Web Company 2012

Hướng dẫn tạo Arrowed sidebar menu bằng css

Bài hướng dẫn này không cần phải sử dụng bất cứ hình ảnh nào, chỉ cần dùng css là chúng ta đã có thể làm được một menu loại này rất đẹp. Cùng theo dõi nhé

Việc sử dụng ít hình ảnh trên website đi sẽ làm cho website load nhanh hơn

Xem qua demo trước cho bạn dễ hình dung sản phẩm của chúng ta.
arrowed sidebar menu with css
I. HTML
Xây dựng cấu trúc html như dưới đây nhé. cái này bạn có thể thêm bớt tùy ý, nhưng tên class thì bạn nên để như vậy.

II. CSS
Đầu tiên là đoạn css cho menu trước đã.

Sau đó, để tạo các online casino bonus no deposit arrow

III.Jquery
Để khi click chuột vào arrow thì các menu nó cũng đổi hiệu ứng theo thì chúng ta sử dụng 1 ít jquery ở đây. cụ thể là đoạn mã dưới đây

Đoạn mã trên rất đơn giản, chỉ là sử lý sự kiện click vào nút a thì chúng ta sẽ remove class=”active” ở nút a cũ, và thêm class này vào nút a mới. Vậy là xong.

Tôi hy vọng bài viết này sẽ tạo cho các bạn một hướng đi mới trong thiết kế website để chúng tối ưu hơn.

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

  • 5.753 hits
%d bloggers like this: