jquery - 照片和视频缩略图库

Question

我一直在为我的投资组合网站寻找一个简单的插件，这样我就可以包含我工作的照片和视频。

我目前在我的网站概念中实现了这一点；简单的缩略图库，但如果我想在其中添加视频，我不知道从哪里开始？即使有可能？我想要 5 个图像缩略图和 1 个视频缩略图，当您单击任何它们时，它们会出现在带有淡入淡出过渡的较大视口中。我不敢相信找到这样的东西是多么困难，肯定有人以前想要这个吗？

Answer 1

我需要这样的东西。
对网络和 jsfiddle 进行了一些研究并修改并提出了这段代码。
工作演示

$(".fancybox").find("img").stop(true, true).animate({
            "opacity": 0.2
        }, "slow");

$(".fancybox").on("mouseenter", function () {
            $(this).find("img").stop(true, true).animate({
                "opacity": 1
            }, "slow");
}).on("mouseleave", function () {
        $(this).find("img").stop(true, true).animate({
            "opacity": 0.2
        }, "fast");
}).fancybox({
padding: 0,
openEffect: 'elastic',
openSpeed: 250,

closeEffect: 'elastic',
closeSpeed: 450,
closeClick: false,

helpers: {
    overlay: {
        css: {
            'background': 'rgba(0, 0, 0, 0.9)'
        }
    }
}
});

它正在使用花哨的盒子插件。
我知道我可能已经迟到了回复，但可能会帮助那里的人寻找相同的查询。