Fancybox V2 CSS for V3

时间:2018-11-13 22:09:25

标签: fancybox-2 fancybox-3

我正在尝试将Fancybox V2.5的项目迁移到V3,但是它需要保留原始外观。

如何在X3的右上角以圆形显示原始X,并在V3中使用其他选项(例如圆角,阴影等)?

1 个答案:

答案 0 :(得分:1)

您可以简单地使用callback添加其他元素,然后使用v2到样式中的css片段,例如:

$('[data-fancybox="images"]').fancybox({
  toolbar  : false,
  smallBtn : false,
  arrows   : false,
  idleTime : false,
  loop     : true,
  transitionEffect : false,
  animationDuration : 333,
  afterLoad : function(instance, slide) {
    $('<a title="Close" class="fancybox-item fancybox-close" href="javascript:;" data-fancybox-close></a><a title="Previous" class="fancybox-item fancybox-nav fancybox-prev" href="javascript:;" data-fancybox-prev><span></span></a><a title="Next" class="fancybox-item fancybox-nav fancybox-next" href="javascript:;" data-fancybox-next><span></span></a>').appendTo( slide.$content );
  }
});

演示-https://codepen.io/fancyapps/full/ePYNZo