IE11 Jumps to top when the lightbox opens

[simonwinklerzh]

Sorry I have very little Time, therefore I have to be brief.

With IE 11, when scrolling down and opening a lightbox, the page jumps to the top and you have to scroll back down to the image.

The issue can be observed on the demo page: https://lokeshdhakar.com/projects/lightbox2/

I had to comment out the following line in order to get rid of the problem: // self.$overlay.focus();

Best regards, Simon

[tristonb2049]

This actually worked for me as well (commenting out the line). Some of my captions roll down to 2 or three lines, and I need to be able to scroll to them. This makes the 'disable scroll' option a bad choice for me. However, I no longer have this issue now that I have commented that line out. Thanks @simonwinklerzh !

[hispanic]

I'm glad I found this submission! @simonwinklerzh - thank you for writing this up. Your fix works for me. However, I really didn't want to include a custom version of the library/script in my codebase. As such, I'm using the following code, instead:

// Need to wait a beat for the #lightboxOverlay element to become available.
let removeTabIndex = setInterval(function() {
    try {
        let lightboxOverlayEle = document.querySelector('#lightboxOverlay');
        if (lightboxOverlayEle !== null) {
            clearInterval(removeTabIndex);
            lightboxOverlayEle.removeAttribute('tabIndex');
        } else {
            console.log('Lightbox config still pending...');
        }
    } catch (error) {
        console.error(error);
        clearInterval(removeTabIndex);
    }
}, 100);

This approach (removing the tabIndex attribute) allows for using the published version of the library.

It appears that this above issue was introduced as a result of addressing issue #663. However, usage of the ESC key does not presents any problems with my site, so undoing the fix should be safe for me.

@lokesh Thank you for Lightbox2! I appreciate your efforts.

[nuschnuschi]

This issue also still occurs on iOS16 Safari 16.

[lokesh]

Cleaning up older issues

I'll be deprecating support for IE11 as it has been end of lifed by Microsoft. And the iOS Safari issue noted in September I am not able to recreate. If the scroll to the top in iOS Safari issue is able to be consistently recreated, please create a new Github Issue and I will happily look into it. Thanks.

[traviskp]

This issue also still occurs on iOS16 Safari 16.

This issue can be fixed by modifying lightbox.min.css from:

.lightboxOverlay { position: absolute;

to

.lightboxOverlay { position: fixed;

Source: https://stackoverflow.com/a/59099052

[learmj]

Like others have posted, changing position from absolute to fixed does not work consistently across various browsers and devices. The only thing that seems to work consistently is the one liner from @simonwinklerzh above.