Fancybox更改下一个和上一个图像源
Fancybox更改下一个和上一个图像源
提问于 2020-03-07 00:52:47
我只是想知道有没有办法在点击之前改变下一个和前一个图片源？我只需要Fancybox来自动调整图像的大小，因为当我在用户单击下一步或上一步按钮(我需要手动操作)后手动调整图像大小时，大小不会改变，有时会被拉伸。是否有一个fancybox属性可以让我设置下一个和前一个图像的源，以便它在幻灯片和滑块上工作得很好？
我设置下一个图像源的代码示例-
jQuery(".fancybox-arrow--right").on('click', function () {
var next = parseInt(index) + 1 + count;
if(next >= newborns.length)
{
console.log("Last Image");
jQuery(this).prop('disabled', true);
}
else{
console.log(next + ' Next');
var newImg = new Image();
newImg.src = newborns[next];
var height = newImg.height;
var width = newImg.width;
if (height > width){
// jQuery(".fancybox-image").css("height","569px");
// jQuery(".fancybox-image").css("width","379px");
/* setTimeout(function(){
jQuery(".fancybox-image-wrap").css("transform","translate(274px, 44px) scale(1, 1)");
},50); */
} else {
// jQuery(".fancybox-image").css("height","569px");
// jQuery(".fancybox-image").css("width","853px");
/* setTimeout(function(){
jQuery(".fancybox-image-wrap").css("transform","translate(136px, 44px) scale(1, 1)");
},50); */
}
jQuery(".fancybox-image").attr("src", newborns[next]);
count++;
}
});问题是，它依赖于用户点击箭头，图像不能正确调整大小，在幻灯片上它根本不起作用。基本上，我有一个图像源的数组，我跟踪用户点击哪个图像并获取索引，通过这个索引，我可以判断哪个图像将是下一个或上一个，但只有在用户单击该图像后才知道。你们有什么建议吗?我该怎么做呢？
回答 1
Stack Overflow用户
发布于 2020-03-18 00:34:48
看起来你想从错误的地方解决问题。不要把事情搞得过于复杂。
1)创建自己的点击处理程序，1)创建图库项目；2)然后手动启动fancybox；
2)或者使用beforeLoad回调操作图片源。您还可以使用afterLoad回调来调整图像尺寸(https://codepen.io/fancyapps/pen/gdVyxg?editors=1010)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60568432
复制相关文章
相似问题
腾讯云开发者
