jQuery to show icon after .hide

I am using the SimpleLightbox plugin (https://wordpress.org/plugins/simplelightbox/) on a test site: http://joshrodg.com/theiveys/about.

If you click on one of the pictures, SimpleLightbox opens a larger version in a Lightbox. You’ll notice that to close the Lightbox you need to click the white “X” in the upper-right hand corner, but that is directly over the page menu (where the three lines are).

So, I added some code that would remove the navigation bar from the page when the Lightbox loads, which looks like:

$(document).ready(function(){
    $(".simplelightbox").click(function(){
        $(".burger").hide();
    })
});

This works because the code gets executed when someone clicks on one of the Lightbox images with the class “simplelightbox”

The problem I’m having is making the nav bar re-appear.

I have tried:

$(document).ready(function(){
    $(".simple-lightbox").click(function(){
        $(".burger").show();
    })
});

but that doesn’t work – the nav bar doesn’t re-appear. That one uses class .simple-lightbox (because that is the main class when the Lightbox is showing) – there is also sl-overlay, sl-wrapper, sl-image, and sl-close but none of those worked either.

Anyone have any ideas?

Thanks,
Josh

Read more here: jQuery to show icon after .hide

Leave a Reply

Your email address will not be published. Required fields are marked *