Question

当flexslider轮播动画开始时，图像似乎被切断。这个问题是否可能出现在flexslider.css样式代码中？

可在此处找到带动画的完整代码：

我在这里放置了怀疑问题的flexslider.css的部分代码。

.flexslider {
  width: 250px;
  height: 600px;
  background: black;

}

.slides {
  width: 100%;
  height:100%;
  padding:0;
  padding-left:30px;
}
.slide {
  width: 100%;
}

.slide img {
  width: 100%;
}


.col{
   float:right;

}
#side{
  width: 40%;
  margin-right: 150px;
  margin-top: 0px;
}

Answer 1

我可以在此处复制您的问题：http://codepen.io/anon/pen/akjzx

现在，我不确定是什么导致了这个问题，因为你无法一起获得现场演示。我建议使用以下CSS值。它应该为您的问题提供解决方案。

.slides {
    width: 100%;
    height: 100%;
    padding-left: -30px; /* Adjust this value; try a negative value */
}

我还建议右键单击Chrome中的图像并选择“检查元素”。这将帮助您调试CSS并可能确定导致图像关闭的原因。

特别是，您可以添加：

.flexslider .slides > li { padding-left: 0; }

Flexslider carousel =在动画/ css *问题期间图像似乎被切断

1 个答案: