Fancybox动态href但没有上一个/下一个箭头显示？

Question

我有fancybox设置，所以它从数据属性动态获取href，如下所示。这工作正常，预计当图像在fancybox中弹出时没有显示上一个/下一个箭头，所以我无法前进或后退。

如何让箭头显示出来？ rel目前设置为rel="photos"，因此应该分组/箭头显示？

        $(".fancybox-photos").each(function () {
            $(this).fancybox({
                href: $(this).data('real-href'),
                afterLoad: function(current, previous) {

                    // Get the slug for the next image
                    var nextImageFullUrlSlug = current.element.data('image-slug');

                    // Update the URL in the browser (but don't reload page)
                    if (history.pushState) {
                        window.history.pushState('', '', nextImageFullUrlSlug);
                    } else {
                        // This is a fall back if pushstate is not supported in browser.
                        document.location.href = nextImageFullUrlSlug;
                    }

                }
            });
        });

我的HTML设置如下：

<% loop $Photos %>

    <a id="$ID" rel="photos" data-real-href="$Image.FitMax(1920,1080).URL" href="$resolveSlugToUrl" class="fancybox-photos" data-image-slug="{$Up.Link}photos/$Slug">

        $Image.SrcSetTag('croppedImage', 395,263, 'FFFFFF', $Caption)

    </a>

<% end_loop %>

我正在使用Silverstripe CMS动态循环访问数据等。