Question

我正在尝试使用bespoke.js实现轮播。我的codepen的链接是Link。

How do I apply z-index to the slides, which are not in focus? 
If I do z-index:1, then the whole orientation changes so, What should be done ?

Answer 1

这是你想要的吗？这允许接下来的两个img显示opacity: 1。 .bespoke-active + .bespoke-inactive将在Active

之后选择第一个非活动img

.bespoke-active + .bespoke-inactive + .bespoke-inactive将在Active：

之后选择第二个非活动img

.bespoke-active + .bespoke-inactive,
.bespoke-active + .bespoke-inactive + .bespoke-inactive{
   opacity: 1;
}

由于你的js lib会将这些类添加到你的部分（img容器），你可以使用它们在Active之前定位img并在活动之后定位img：

.bespoke-before-1,
.bespoke-before-2,
.bespoke-after-1,
.bespoke-after-2 {
  opacity: 1;
}