Javascript Fancybox+;轻快。iOS定向问题

Javascript Fancybox+;轻快。iOS定向问题,javascript,jquery,fancybox-3,flickity,Javascript,Jquery,Fancybox 3,Flickity,在Fancybox模式窗口中,我有Flickity旋转木马。在iPad上,当我改变方向时,Flickity就会停止正常工作。flickity视口显示为0px。桌面窗口大小调整没有问题。不知道在iPad上方向改变时如何更新Flickity $(文档).ready(函数(){ $('.carousel container')。每个(函数(i,容器){ var$container=$(container); //主轻快度 var$carouselMain=$container.find('.car

在Fancybox模式窗口中,我有Flickity旋转木马。在iPad上,当我改变方向时,Flickity就会停止正常工作。flickity视口显示为0px。桌面窗口大小调整没有问题。不知道在iPad上方向改变时如何更新Flickity

$(文档).ready(函数(){
$('.carousel container')。每个(函数(i,容器){
var$container=$(container);
//主轻快度
var$carouselMain=$container.find('.carouselMain').flickity({
想象:是的,
位置:false,
pageDots:false,
自适应高度:真
});
//导航灵活性
$container.find('.carousel nav').flickity({
asNavFor:$carouselMain[0],
包含:对,
pageDots:false,
群居:没错,
自适应高度:正确,
prevNextButtons:false
});
});
$(“[data fancybox]”。fancybox({
空闲时间:错,
错,
按钮:[
“结束”
],
触摸:{
垂直:假,
动量:错
},
轮子:错,
后演示:功能(实例、幻灯片){
幻灯片.$slide.find('.carousel main').flickity('resize');
幻灯片.$slide.find('.carousel nav').flickity('resize');
}
});
});
.carousel{
背景:#FAFAFA;
边缘底部:40px;
}
.传送带单元{
宽度:100%;
高度:200px;
右边距:10px;
背景#8C8;
边界半径:5px;
计数器增量:转盘单元;
}
/*细胞数*/
.传送带单元:之前{
显示:块;
文本对齐:居中;
内容:计数器(转盘单元);
线高:200px;
字号:80px;
颜色:白色;
}
.传送带导航.传送带单元{
高度:80px;
宽度:100px;
}
.转盘导航。转盘单元格:之前{
字体大小:50px;
线高:80px;
}
.carousel-nav.carousel-cell.is-nav-selected{
背景:#ED2;
}
.模态窗口{
宽度:985px;
填充:0;
背景:无;
}
.模态窗内部{
宽度:980px;
填充:40px;
位置:相对位置;
背景:白色;
}

我认为这是因为fancybox在设备方向更改事件中隐藏了一段时间的内容,也许可以尝试为fancybox添加此内容,看看是否有帮助:

onUpdate : function( instance, slide ) {
    slide.$slide.find('.carousel-main').flickity('resize');
    slide.$slide.find('.carousel-nav').flickity('resize');
}

非常感谢你!