fancybox-3 close button disable/enable delay not working - button

Question

I have my fancybox close button diplay:none; when an iframe opens, I want the close button appears in a delay of x time. exactly like this DEMO.
Though it is solved in earlier version of fancy box in here, but in fancybox-3 It works for the first time and thereafter the close button doesn't appear until I refresh the page.
I use the following JS Code for delay:
$(document).ready(function() {
setTimeout(function() {
$(".fancybox-button--close").show();
}, 5000);
});
Any ideas? Thanks.

Answer 1

This is how you can access the toolbar and make it visible, if needed:
$('[data-fancybox="images"]').fancybox({
afterShow : function(instance, slide) {
setTimeout(function() {
instance.$refs.toolbar.show();
}, 3000);
}
});
Demo - https://codepen.io/anon/pen/oeWqrJ
But, if you want to toggle that small close button, here is an example:
$('[data-fancybox]').fancybox({
toolbar : false,
smallBtn : true,
afterShow : function(instance, slide) {
setTimeout(function() {
slide.$slide.find('.fancybox-close-small').show();
}, 3000);
}
});
Demo - https://codepen.io/anon/pen/oeWqRJ
Basically, you can access any element either from instance.$refs (collection of references to interface elements) or from slide.$slide (parent element of the content).