Active NavBar | Sololearn: Learn to code for FREE!
Новый курс! Каждый программист должен знать генеративный ИИ!
Попробуйте бесплатный урок
+ 2

Active NavBar

How do I make my navbar active

24th May 2024, 7:56 PM
Kevin
Kevin - avatar
16 ответов
+ 5
I think you want to demonstrate a website, but SoloLearn only allows a single static page (index.html). To create a multi-page website, you would need separate files like: index.html about.html blogs.html contacts.html If you have a computer you can create the documents locally and try it out.  There are various Web IDE that allow multiple page loading. A simple Google search will return results. Or if mobile is your only device you can search for and download an HTML IDE app.
27th May 2024, 3:09 AM
Chris Coder
Chris Coder - avatar
+ 1
Like this
24th May 2024, 9:16 PM
Kevin
Kevin - avatar
+ 1
I meant how do I make it active
24th May 2024, 10:13 PM
Kevin
Kevin - avatar
+ 1
Sorry I meant for this one
25th May 2024, 10:27 AM
Kevin
Kevin - avatar
0
Employ JavaScript to make them interactive if you are using HTML.
24th May 2024, 8:49 PM
SilverBack Generation
SilverBack Generation - avatar
0
It means NavigationBar
24th May 2024, 9:16 PM
Kevin
Kevin - avatar
0
Edit the bug ( >) in the nav of line 10.
24th May 2024, 9:27 PM
SilverBack Generation
SilverBack Generation - avatar
0
Could try something like this. Since you're using jQuery. This code will remove the "active" class from all the links and add it to the link that was just clicked. Also I set active on line 63 in CSS. https://sololearn.com/compiler-playground/WfqfmU60UwpI/?ref=app
25th May 2024, 1:34 AM
Chris Coder
Chris Coder - avatar
0
if you mean a visual indicator when it is clicked or hovered, maybe add a pseudo class :hover or :active to it. nav:hover{ background-color: red; } https://www.w3schools.com/css/css_pseudo_classes.asp also, you don't really need to be that verbose in your css specifiers. you can simply use the class specifier .items{ ... } no need for : nav ul li .items unless you are running into issues. Also put a space between the tag name and class specifier li .items{... not li.items{...
25th May 2024, 1:56 AM
Bob_Li
Bob_Li - avatar
0
I mean how do I make my navbar really work
25th May 2024, 8:38 AM
Kevin
Kevin - avatar
0
Kevin you need to add the show class to the li by default. Right now, they are invisible. <li class="items show"><a href="#">Home</a></li> <li class="items show"><a href="#">About</a></li> <li class="items show"><a href="#">Blogs</a></li> <li class="items show"><a href="#">Contact</a></li> <li class="items show"><a href="#">Feedback</a></li>
25th May 2024, 9:32 AM
Bob_Li
Bob_Li - avatar
0
👍
25th May 2024, 10:26 AM
Kevin
Kevin - avatar
0
Oi
26th May 2024, 2:24 AM
Gabriel Lima
Gabriel Lima - avatar
26th May 2024, 4:54 AM
Suhani Kewat
0
Oii
27th May 2024, 1:30 AM
Davi de Lima
Davi de Lima - avatar