Hamburger side bar button minor issue

  • Resolved sarangianurag.doe

    (@sarangianuragdoe)


    8 years, 2 months ago

    Hi my hamburger menu is working fine but has a slight issue which i think is related to its script.
    The issue is it doesn’t work unless I scroll the site a bit. You see a pink button as the site loads you click it and it doesn’t work unless you scroll slightly. Hope you got the drift. Check here: http://www.elevendwind.com

    The script I am using is

    <script>

    // Making the side menu work

    $(document).ready(function() {

        $('.menu-toggle').click(function(e){

            var menu = $(this).data('show-dialog');

            $('.' + menu).toggleClass('side-menu-shown');

        });

        $('.side-menu-close').on('click', function () {
            $('.side-menu-basic').removeClass('side-menu-shown');
        });

           });

</script>

    Any ideas on how this can be fixed. Thank for your help.
    Cheers!

Viewing 3 replies - 1 through 3 (of 3 total)
  • graphicscove

    (@graphicscove)

    8 years, 2 months ago

    Your issue isn’t Javascript related but is an issue caused by a div overlaying the whole page, this stops the button from being clicked until you scroll down and the div gets left at the top of the page. The div in question has the class of “title-card”.

    Also you might want to attach something to that function event:

    function(e)

    Why have it if it’s not doing anything? I would assume you mean to prevent a default action on an ‘a’ tag that doesn’t actually exist in the DOM. Just remove the letter from the function brackets 🙂

    Thread Starter sarangianurag.doe

    (@sarangianuragdoe)

    8 years, 2 months ago

    That’s perfect tweaking the height of title-card fixes the problem. Thanks a lot. can you tell me how did you found this out. Did you check the DOM? if yes what did you look for in it?

    Thanks again! Cheers.

    graphicscove

    (@graphicscove)

    8 years, 2 months ago

    I used Chrome dev tools, right clicked on the nav icon and selected ‘inspect element’. The DOM element it highlighted was the large div instead of the icon which I then realised was overlapping the button.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Hamburger side bar button minor issue’ is closed to new replies.