Question

我正在使用光滑的轮播http://kenwheeler.github.io/slick/，我遇到了一个问题，我无法设置格式化轮播，因此它在我的页面上正确显示。现在，它看起来像这样：

...我希望它看起来像演示：

我的HTML是：

<div id='slickcontrol'>
<div class="slick">
  <div><img class='slickimage' src='images/choice1small.jpg'/></div>
  <div>2</div>
  <div>3</div>
</div>
</div>

我尝试将此设置为.slickcontrol的：

#slickcontrol{
width:400px;
margin:auto;
position:relative;
}

但无济于事。发生了什么事？

Answer 1

您是否将光滑附加到.slick而不是#slickcontrol？同时尝试从position:relative;删除#slickcontrol。

#slickcontrol{
  width:400px;
  margin:auto;
}


$(document).ready(function(){
  $('.slick').slick({
    setting-name: setting-value
  });
});

Answer 2

这是它的外观屏幕截图吗？

两个想法。一：看起来javascript没有加载，或者你没有正确的jquery版本

根据制造商网站..

Add slick.js before your closing <body> tag, after jQuery (requires jQuery 1.7 +)

二：如果您只是想让图像在其容器内很好地居中，我在您的CSS中添加了一些简单的行......

http://jsfiddle.net/g4GKm/

光滑的旋转木马格式正确

2 个答案: