Issues with Shiftnav

  • Hey first all thanks for an awesome plugin – this is really good.

    Got a slight issue, when the lightbox is open, the shiftnav bar is over the icons at the top meaning it is not easy for user to exit the lightbox. I know they can swipe down to get rid of it but ideally I wanted the lightbox above the shiftnav but not sure how to do this as the lightbox is coded inside the shiftnav body and not outside it.

    I am trying to do some kind of javascript to hide the shiftnav bar when lightbox is activated but is there a solution to this?

    Thanks in advance.

    Dan

Viewing 1 replies (of 1 total)
  • Plugin Author Arno Welzel

    (@awelzel)

    Do you mean https://www.ads-software.com/plugins/shiftnav-responsive-mobile-menu/?

    It seems shiftnav changes the whole structure of the page, so any other plugins adding content (like Lightbox with PhotoSwipe) will be part of what shiftnav defines as “content” and not outside of it. On https://sevenspark.com/docs/shiftnav/javascript-api there is an API call which can be used to close the menu if needed. It should be possible to add this call to the event handler of PhotoSwipe which is in wp-content/plugins/lightbox-photoswipe/js/frontend.js (used minified as frontend.min.js).

    This is just a wild guess – I did not check this yet:

    jQuery(function($) {
    var PhotoSwipe = window.PhotoSwipe,
        PhotoSwipeUI_Default = window.PhotoSwipeUI_Default;

    $('body').on('click', 'a[data-width]:has(img)', function(e) {
        if( !PhotoSwipe || !PhotoSwipeUI_Default ) {
            return;
        }

        e.preventDefault();
        
        // Add this to close the shiftnav menu before opening the
        // lightbox when clicking an image
        if(typeof jQuery( '#shiftnav-main' ).shiftnav === 'function') {
            jQuery( '#shiftnav-main' ).shiftnav( 'closeShiftNav' );
        }

        openPhotoSwipe( false, 0, this, false, '' );
    });
...

    If you modify your version of frontend.js don’t forget to minify it again to frontend.min.js or change the code in lightbox-photoswipe.php so it will use frontend.js and not the minified version.

    Edit:

    If this works, let me know and I’ll add this for the next update.

    • This reply was modified 4 years, 9 months ago by Arno Welzel.
Viewing 1 replies (of 1 total)
  • The topic ‘Issues with Shiftnav’ is closed to new replies.