Làm Menu Đa Cấp Với Bootstrap

      22

Giới thiệu

Hôm nay mình xin chia sẻ cho các bạn phương pháp tạo thực đơn nhiều cung cấp (sub-menu) với Bootstrap. Mặc định thì bên trên bootstrap vẫn phối kết hợp navbar cùng dropdown nhằm tạo nên menu dạng này, mà lại sẽ không còn tiện thể Lúc thực hiện, đồng thời sinh sản menu nhiều cấp cho bằng vòng lặp Khi code cũng tương đối phiền phức.Hiện cũng có không ít thư viện jquery cung cấp cho bài toán này, mặc dù mình thấy nhiều phần áp dụng tương đối phức hợp, đôi khi cũng nhằm phần lớn người dân có thêm 1 tuyển lựa.

*
Giao diện trên đồ vật tính
*
Giao diện trên di động

Download

Download:Tại đâyPass giải nén: saigonpx.vn


Bạn đang xem: Làm menu đa cấp với bootstrap

Đây đang dần là phiên bạn dạng 1.0, giả dụ trong quá trình áp dụng phân phát hiện nay lỗi gì vui vẻ còn lại phản hồi bởi khí cụ facebook-bình luận bên dưới. (Lưu ý là mình đã không thảo luận qua Live sầu chat nhé).

Hướng dẫn sử dụng

Thêm đoạn css sau vào thẻ head

Thêm đoạn javascript sau trước khi đóng góp thẻ body

Trong số đó #navbar là id của element chứa ul menuVd:

Một sốtùy biến

desktopsubmenuicon (true/false)Bật tắt Việc tất cả hiện ibé subthực đơn bên trên hình ảnh desktop tốt không

*
mobileiconpack(glyphicon/ fa)Sử dụng ibé tự glyphibé hayphông awesome (giả dụ dùngfont awesome thì bắt buộc chèn thêm css tương ứng)mobileopenicon(glyphicon-chevron-down)Inhỏ msinh hoạt sub-thực đơn bên trên bối cảnh di động, tương ứng với mobileiconpachồng đang dùng phía trênmobilecloseicon(glyphicon-chevron-up)Icon đóngsub-menu trên giao diện cầm tay, tương ứng cùng với mobileiconpachồng vẫn dùng phía trên

Vd:

$("#navbar").btrmenu( desktopsubmenuicon: true, mobileiconpack: "glyphicon", mobileopenicon: "glyphicon-chevron-down", mobilecloseicon: "glyphicon-chevron-up",);


*
Hướng dẫn giải pđợi dung lượng hộp thỏng Gmail

Xem thêm: Hướng Dẫn Cài Icon Cho Facebook Trên Điện Thoại, TảI Icon Facebook MớI

*
Đăng cam kết liên quan công ty lớn của khách hàng lên Google maps
*
Hướng dẫn cài đặt Google Drive bên trên máy tính
*
Lựa lựa chọn phông chữ trong xây cất website
*
Hướng dẫn cài thêm dung tích mang lại vỏ hộp thỏng Gmail (Google Drive)
CÔNG TY CỔ PHẦN TRUYỀN THÔNG SÀI GÒN ẢNH ĐIỂM Lầu 4, 1055-1057 Trần Hưng Đạo, P.5, Q5, TP HCM Hotline Tư vấn: 0931-773-680 contact
*
Hướng dẫn sản xuất chữ ký tin nhắn đẹp mắt trên Gmail của Google

Trong quá trình áp dụng tin nhắn, câu hỏi thiết lập cấu hình chữ cam kết trên gmail là thao tác yêu cầu có tác dụng nhằm các gmail sau...