Javascript Fancybox 3-使用触发器在Fancybox中打开图像，但不要单击图像

我正在试图找到一种方法，使用Fancybox 3只需单击触发器即可打开图像（按属性

数据Fancybox href

）。单击源图像本身时，不应打开fancybox，而应打开另一个页面（默认属性

href

）。但是，Fancybox必须使用源图像，因为只有这样才会出现

动画效果：“缩放”

这似乎异常困难，我在Fancybox 3中没有找到一个完整的方法来解决它。我将感谢任何帮助

这里是一个基本示例和JSFIDLE。在这种情况下，btn会在打开Fancybox的图像上触发

单击事件，或者图像本身会打开Fancybox。我只希望第一次发生，但不希望出现在图像上

<div class="product">
    <div class="media">
        <a href="https://www.google.com/" class="product-image-link" data-fancybox="shop-gallery" data-fancybox-href="https://cdn.pixabay.com/photo/2015/12/01/20/28/road-1072823__340.jpg">
      <img width="280" height="200" src="https://cdn.pixabay.com/photo/2015/12/01/20/28/road-1072823__340.jpg">
    </a>
    </div>
    <span class="product-lightbox-btn">Expand</span>
</div>

<script>
$( "[data-fancybox]" ).fancybox(
    {
        animationEffect: "zoom",
        beforeLoad : function(instance, current) {
            // Alternative img link
            var dataFancyboxHref = current.opts.$orig.attr( "data-fancybox-href" );
                this.src = dataFancyboxHref;
        },
    }
);

$( ".product-lightbox-btn" ).click( function() {
    $(this).closest( '.product' ).find( '.product-image-link' ).trigger( 'click' );
});
</script>


扩大
$（“[data fancybox]”。fancybox(
{
动画效果：“缩放”，
加载前：函数（实例，当前）{
//替代img链路
var dataFancyboxHref=current.opts.$orig.attr（“数据fancybox href”）；
this.src=dataFancyboxHref；
},
}
);
$（“.product lightbox btn”）。单击（函数（）{
$（this）.closest（'.product'）.find（'.product image link'）.trigger（'click'）；
});