光滑滑块 - 箭头不可见，直到它在视口

Question

我一直用光滑的轮播多次面对这个问题

在滚动到滑块的“视口”之前，您无法看到箭头。它看起来像z-index问题，但绝对不是

此问题的视频 https://www.dropbox.com/s/33fu5btk5c3wqfn/Video%2002-02-2018%2C%2010%2038%2008.mp4?dl=0

当幻灯片使用transformX更改时也可能发生这种情况（在这种情况下不会淡出）。当滑块更改幻灯片时箭头消失，并在转换完成后立即返回

我没有附上完整的html + js + css代码。希望有些人以前曾经面对这个并且知道我在说什么，因为它很常见

.slick-arrow{
  position: absolute;
  z-index: 10;
  top: -webkit-calc(55% - 25px);
  top: calc(55% - 25px);
  height: 50px;
  left: 65px;
}

这可能与will-change，transform或其他可能有用并且强制按钮位于滑块顶部的奇特事物有关吗？

css的其余部分只是来自slick.js repo的常规捆绑（最新版本） .slick-slider有touch-action: pan-y和-webkit-tap-highlight-color: transparent，这也让我感到困惑

P.S。网站链接http://mice.surge.sh/homepage.html（.reviews__slider部分） 最有可能你看不到桌面设备上的错误。它在iOS设备上被注意到

Answer 1

我看到的内容与视频中的内容不同。

要解决此问题，您需要将#reviews .reviews__slider .slick-arrow:last-child{ }添加到StartWorkflowExecution

如果有帮助，请告诉我。