我无法完全使用Slick滑杆

Question

我正在尝试使用褪色的Slick滑块在我的网站上工作。 但是我没有运气。 这是Slick： http : //kenwheeler.github.io/slick/

如果向下滚动，则会看到有关实现方法的说明。 我已附上我的屏幕截图，因此希望有人可以看到我在做什么错。

 <html> <head> <title>My Now Amazing Webpage</title> <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.3.11/slick.css"/> </head> <body> <div class="fade"> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> </div> <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.3.11/slick.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.fade').slick({ dots: true, infinite: true, speed: 500, fade: true, slide: '> div', cssEase: 'linear' }); }); </script> </body> </html>

我是Java和Jquery的新手，所以我觉得我在搞砸。

加载页面时，我看到的只是3张测试图像，一张在另一张下面。

有人知道我在做什么错吗？

Answer 1

问题出在slide设置中（查询元素以选择滑块）

例如更改：

$('.fade').slick({
  dots: true,
  infinite: true,
  speed: 500,
  fade: true,
  slide: '> div',
  cssEase: 'linear'
});

至

$('.fade').slick({
    dots: true,
    infinite: true,
    speed: 700,
    autoplay:true,
    autoplaySpeed: 2000,
    arrows:false,
    slidesToShow: 1,
    slidesToScroll: 1
 });

可行，只需要进行设置即可。 您将slide定义为> div （ > div中间子级），因此，如果将其删除（默认为div ），它将起作用。

 <html> <head> <title>My Now Amazing Webpage</title> <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.3.11/slick.css"/> </head> <body> <div class="fade"> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> <div><img src="http://placehold.it/1000x400&text=[ img 1 ]" /></div> </div> <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.3.11/slick.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.fade').slick({ dots: true, infinite: true, speed: 700, autoplay:true, autoplaySpeed: 2000, arrows:false, slidesToShow: 1, slidesToScroll: 1 }); }); </script> </body> </html>

我无法完全使用Slick滑杆

问题描述

1 个解决方案

解决方案1
6 已采纳 2014-12-30 13:23:13

我无法完全使用Slick滑杆

问题描述

1 个解决方案

解决方案1 6 已采纳 2014-12-30 13:23:13

解决方案1
6 已采纳 2014-12-30 13:23:13