javascript - Photoswipe 图库关闭后如何控制焦点？

Question

因此，当用户单击带有图库的图像并决定查看图像并关闭图库时，浏览器窗口会将他带到页面顶部。这不利于可访问性。焦点应该移回到原来的位置在页面中的位置。

您有任何想法可能会导致什么以及如何控制焦点吗？我认为这与图库添加的 URL 哈希有关？

到目前为止我已经检查过...

Photoswipe 文档 - 更改选项>历史 - false:没有帮助:(

我必须尝试附加监听器并手动设置焦点:它没有监听:(

 var pswp = new PhotoSwipe(/* ... */);
 pswp.listen('close', function() { console.log'check 123';});

Answer 1

我在使用 Cordova 和 iOS 时遇到了同样的问题。

首先按照 http://photoswipe.com/documentation/getting-started.html 中的示例进行操作并搜索带有注释的行

//将数据传递给 PhotoSwipe 并初始化

调用方法“gallery.init()”后添加下一个代码

gallery.listen('close', function() {
// Here use something for detect the device or just delete the IF 
if (isIOS) {
    //if iOS scroll to img/element
    var _top = $(this.currItem.el).offset().top - 100;
    setTimeout(function() {
        $('html, body').stop().animate({
            scrollTop: _top
        }, 500);
        //$.mobile.silentScroll(_top);
    }, 500);
}}); 

最终代码。

var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) {

// ...
// ...

// Pass data to PhotoSwipe and initialize it
gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
gallery.init();

gallery.listen('close', function() {
    // Here use something for detect the device or just delete the IF 
    if (isIOS) {
        //if iOS scroll to img/element
        var _top = $(this.currItem.el).offset().top - 100;
        setTimeout(function() {
            $('html, body').stop().animate({
                scrollTop: _top
            }, 500);
            //$.mobile.silentScroll(_top);
        }, 500);
    }
}); };