Close Fancybox 2 width Focus don't work in gal

2019-08-26 02:21发布

I have a problem with Fancybox 2. When Fancybox is in gallery mode and that I close the Fancybox with the focus (keyboard enter key), it moves to the second image. I can't close my Fancybox with keyboard (except ESC), it works only with mouse.

You can test this here http://jsfiddle.net/korigan/qfxZd/2/

$('.fancybox').click(function(){
       focusLink = this;
   }).fancybox({
    beforeLoad: function() {
        $('a, input, button').attr('tabIndex', -1);
        $('.fancybox-overlay a, .fancybox-overlay button, .fancybox-overlayinput').attr('tabIndex', 0);
    },
    afterClose: function() {
        focusLink.focus();
        $('a, button, input').attr('tabIndex', 0);
    },
});

Thanks for your help.

1条回答
Emotional °昔
2楼-- · 2019-08-26 02:28

Fancybox has the keys option to set the behavior of specific pressed keys .... the default for enter key is navigate to the next image of a gallery from left. You can override this behavior by declaring the set of keys to move to the next image and omit the enter key (numeric value = 13) so it will be removed from the stack like :

keys: {
    next: {
     // 13: 'left', // enter key will do nothing (left is default behavior)
        34: 'up', // page down
        39: 'left', // right arrow
        40: 'up' // down arrow
    }
}

Additionally, you can set the enter key to close fancybox within the same option like :

keys: {
    close: [13], // enter key now closes fancybox
    next: {
     // 13: 'left', // enter doesn't show next image from left
        34: 'up', // page down
        39: 'left', // right arrow
        40: 'up' // down arrow
    }
}

... see JSFIDDLE

查看更多
登录 后发表回答