Welcome, Guest: Register On Nairaland / LOGIN! / Trending / Recent / New
Stats: 3,150,350 members, 7,808,220 topics. Date: Thursday, 25 April 2024 at 08:59 AM

Website Navigation Like The One On Vanguard Website - Programming - Nairaland

Nairaland Forum / Science/Technology / Programming / Website Navigation Like The One On Vanguard Website (1286 Views)

How To Create A Simple Responsive Navigation Bar Using Html, Css And Jquery / Danfos Frequency Control (LCP 102) Navigation Keys . / Awesome Responsive Navigation Bar HTML CSS JAVASCRIPT (2) (3) (4)

(1) (Reply) (Go Down)

Website Navigation Like The One On Vanguard Website by ace1(m): 7:43pm On Nov 14, 2016
Can someone here direct me on how to develop a menu like the one on www.vanguardnr.com If you reduce the window size, you'll notice a new menu item "More" is created and other menu items that can't fit in the navigation bar are placed as submenus on the "More" menu item. What I need to know is the logic.

Thanks
Re: Website Navigation Like The One On Vanguard Website by Emmach10(m): 8:26pm On Nov 14, 2016
I think it's the work of bootstrap
Re: Website Navigation Like The One On Vanguard Website by ace1(m): 3:01pm On Nov 15, 2016
Emmach10:
I think it's the work of bootstrap
Really? How? I don't think that done by Bootstrap
Re: Website Navigation Like The One On Vanguard Website by Sibrah: 8:02pm On Nov 16, 2016
You want certain list items (li) to hide when the page width reduces beyond a value.
If you were to do it without a framework then it will likely involve:
1) knowing the li(s) you want to hide beforehand, 2) creating two copies of those li(s), placing one set of the li(s) directly, under the ul(unordered list) wrapper and the other under the "more" li.
3) Then finally you toggle the appearance of "more" li and the li(s) to be hidden.
Toggling is possible through Js or html radio button embbeded within the li(s).

(1) (Reply)

Easy Math HD (my Android Math Game) Updated! / Please I Need Help With A Challenge / Java Programmer Wanted

(Go Up)

Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health
religion celebs tv-movies music-radio literature webmasters programming techmarket

Links: (1) (2) (3) (4) (5) (6) (7) (8) (9) (10)

Nairaland - Copyright © 2005 - 2024 Oluwaseun Osewa. All rights reserved. See How To Advertise. 9
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.