IF condition in javascript only works once

Question

I’m trying to make a Side Navigation, so in Internet search, I found a little tutorial on the site: How TO - Side Navigation

However, in my example I wanted a single button to open and close, so I made the following modifications:

function closeNav()
{    
    if (document.getElementById("mySidenav").style.width < 250)
    {
        document.getElementById("mySidenav").style.width = "250px";
    }
    else
    {
        document.getElementById("mySidenav").style.width = "40px";
    }  
}

But, it only works once, IE, it opens and closes then no longer works.

Answer 1

The value that .style.width returns is a string. You have to use a type converter to have a number and use the operator <.

You could do it like this:

function closeNav() {
    var sideNav = document.getElementById("mySidenav");
    if (parseInt(sideNav.style.width) < 250) {
        sideNav.style.width = "250px";
    } else {
        sideNav.style.width = "40px";
    }
}