为什么滑动滑块不能与标签一起使用？

Question

我在标签中使用了光滑的滑块。在第一个标签中，幻灯片效果很好。但是，当我们单击第二个选项卡时-滑块消失了。

https://codepen.io/malinosky/pen/jvgqxO?editors=1010

我用过

$('.js-photo').slick("setPosition", 0);
$('.js-presentation').slick("setPosition", 0);

但这对我不起作用。我怎么了？

Answer 1

因为隐藏了滑块，所以它的高度为0。

因此，当滑块可见时，您应该刷新滑动的位置：

target.fadeIn("200", function() {
    $('.js-photo').slick("setPosition", 0);
});

示例：https://codepen.io/anon/pen/jvgVqR

Answer 2

codepen演示错过了最初的setPosition原始代码。

我还分叉了一个Codepen演示： https://codepen.io/RobJS/pen/zJgojN?editors=1010

Answer 3

return list.Except(listToExclude).GroupBy(n => n).Any(c => c.Count() > 1);

使用 autoplay: false, autoplaySpeed: 2000, fade: true, arrows: false, **lazyLoad:'ondemand'** 并单击后等待2秒钟（codepen需要这段时间进行更新）。

Answer 4

我已经通过CSS找到了一种解决方案，并且在我的系统中效果很好。

您可以将非活动标签设置为

overflow-y: hidden
height: 0

代替经典

display:none

参考链接： https://github.com/kenwheeler/slick/issues/341

谢谢