jQuery FancyBox图片库中的推拉门效果

jQuery Sliding door effect in FancyBox image gallery?

本文关键字：推拉门 FancyBox 图片库 jQuery      更新时间：2023-09-26

如何在投资组合库中使用滑动门悬停效果使FancyBox jQuery图像可点击？现在滑动门效果有效，但是当您单击图库图像时，花哨的框不会做任何事情。

如何让 jquery.easing.1.3.js（滑动门效应）和 jquery.fancybox.js 一起工作？

我按照本教程注释中的说明删除：window.location = $（this）.find（'a'）.attr（'href'）; - 在jquery.easing HTML头标签代码中

我的网站有很多事情要做，因为它是一个单页的投资组合。我正在尝试完成这个网站以发送给雇主的工作。我很沮丧，因为我在这个网站上工作了很长时间，我需要一份工作！

你必须替换 

window.location = $(this).find('a').attr('href');

跟

var url = $(this).find('a').attr('href');
$.fancybox({
    'padding'       : 0,
    'href'          : url,
    'title'         : 'Lorem ipsum dolor sit amet',
    'transitionIn'  : 'elastic',
    'transitionOut' : 'elastic',
    'type'      : 'image'
});

请注意，

我正在使用'type' : 'image'，因为我正在从http://placekitten.com/200/300等链接加载图像，在这种情况下，强制类型是必要的，因为url没有有效的图像扩展名。

如果您不需要它，请将其删除。

工作演示

相关文章：