+ 2
Active NavBar
How do I make my navbar active
16 Respostas
+ 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.
+ 1
Like this
+ 1
I meant how do I make it active
+ 1
Sorry I meant for this one
0
Employ JavaScript to make them interactive if you are using HTML.
0
It means NavigationBar
0
Edit the bug ( >) in the nav of line 10.
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
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{...
0
I mean how do I make my navbar really work
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>
0
👍
0
Oi
0
A responsive navbar
https://sololearn.com/compiler-playground/W5m74nkxE30w/?ref=app
0
Oii