Thursday, March 1, 2018

Add active class on click using javascript

<script>
function act()
{
var selector, elems, makeActive;

selector = '.nav li';

elems = document.querySelectorAll(selector);

makeActive = function () {
    for (var i = 0; i < elems.length; i++)
        elems[i].classList.remove('active');

    this.classList.add('active');
};

for (var i = 0; i < elems.length; i++)
    elems[i].addEventListener('mousedown', makeActive);
}
</script>

<ul class="nav">
        <li onclick="act();"><a href="#intro" title="Next Section">a</a></li>
        <li onclick="act();"><a href="#second" title="Next Section">b</a></li>
        <li onclick="act();"><a href="#third" title="Next Section">c</a></li>
       <!-- <li><a href="#fifth" title="Next Section"><img src="slid/images/dot.png" alt="Link" /></a></li> -->
   
    </ul>

No comments:

Post a Comment