Toggle Menu Onclick, Close By Clicking Menu Link - But Only In Mobile View

I've made a responsive menu for a one page website that switches to a toggleable menu, when the window width is lower than 768px. Basically I want the menu to be toggled by a click

Solution 1:

I've been trying to recreate your problems with if($('#pull').is(':visible')) but for me the following works just fine.

jQuery(document).ready(function() {
    var e = $("#pull");
    menu = $("#header ul"), $(e).on("click", function(e) {
        e.preventDefault(), menu.slideToggle()
    }), $(window).resize(function() {
        menu.is(":hidden") && menu.removeAttr("style")
    })
});
$("#header ul").on("click", "li", function () {
    if($("#pull").is(":visible")) {
        //Use slideToggle() here for a better look and feel of the menu 
        $("#header ul").slideToggle();
    }
});

I don't see where your problem might be with this method but this should work just fine