I built a single-page website. The navigation is made up of buttons styled with bootstrap 3.
Since it's a single page, the buttons are anchor tags. I'm trying to figure out how to apply an .active
class to the last clicked anchor tag.
Here is the structure of my HTML:
<a href="#home">
<button type="button" class="btn btn-default btn-lg active">
<span class="glyphicon glyphicon-home"></span> Home
</button>
</a>
<a href="#about">
<button type="button" class="btn btn-default btn-lg">
<span class="glyphicon glyphicon-user"></span> About
</button>
</a>
Additionally, this is the CSS I am using:
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
border:none;
background-color: #2C3E50;
border-bottom: 1px solid #2C3E50;
}