Почему slick.js не хочет работать?

Question

[Lolut]

Начал использовать slick.js недавно, все подключил и вроде бы должно все работать, но сам не понимаю. Все стоит на месте.

<div class="slider">
    <div class="text-info">
 <div class="col-md-6">
  <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi dolorum doloribus at officiis repudiandae facere eaque officia. Quasi fuga fugiat eligendi natus vitae facilis, odit.</p>
<cite>Lorem ipsum.</cite>
</blockquote>
</div>
    <div class="text-info">
 <div class="col-md-6">
  <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat cumque eius, soluta perspiciatis et. Alias sunt eligendi sequi, facilis itaque dolore fugiat consequatur ex provident.</p>
<cite>Lorem ipsum.</cite>
</blockquote>
</div>
    <div class="text-info">
  <div class="col-md-6">
        <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae ex natus sed maiores modi enim amet a! Totam deleniti obcaecati asperiores maiores, quaerat expedita animi!</p>
          <cite>Lorem ipsum.</cite>
</blockquote>
      </div>      
  </div>
.slider {
margin-top: 30px;
background-color: #252525;
height: 450px;
.text-info {
text-align: center;
margin: 0 auto;
  blockquote {
  border-left: none;
  color: #fff;
  font-size: 25px;
}
}
}

//Slider
$(document).ready(function(){
  $('.slider').slick();
});

//Скрипты вроде бы последовательно подключил
<script  src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="assets/js/slick.min.js"></script>
<script src="assets/js/functions.js"></script>

Answer 1

[Владислав Бойченко]

1. У вас разметка неправильная, блоки не везде закрытые.
2. Вы не подключили основные стили слайдера.
3. Вот как надо: тыц

Answer 2

[Sergey]

Вставьте вызов функции slick() после подключения slick.min.js. И, конечно, внутри тега <script>

Comments

[Lolut]

<div class="slider">
    <div class="text-info">
 <div class="col-md-6">
  <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi dolorum doloribus at officiis repudiandae facere eaque officia. Quasi fuga fugiat eligendi natus vitae facilis, odit.</p>
<cite>Lorem ipsum.</cite>
</blockquote>
</div>
    <div class="text-info">
 <div class="col-md-6">
  <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat cumque eius, soluta perspiciatis et. Alias sunt eligendi sequi, facilis itaque dolore fugiat consequatur ex provident.</p>
<cite>Lorem ipsum.</cite>
</blockquote>
</div>
    <div class="text-info">
  <div class="col-md-6">
        <blockquote> 
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae ex natus sed maiores modi enim amet a! Totam deleniti obcaecati asperiores maiores, quaerat expedita animi!</p>
          <cite>Lorem ipsum.</cite>
</blockquote>
      </div>      
  </div>



<script>
  $(document).ready(function(){
     $('.slider').slick();
  })
</script>
<script  src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script src="assets/js/slick.min.js"></script>
<script src="assets/js/functions.js"></script><blockquote></blockquote>