В моем проекте я использую плагин Slick Slider (http://kenwheeler.github.io/slick/ ). Мне было интересно, если это возможно, чтобы изменить положение скользких точек. По умолчанию они отображаются под контейнером div, для которого применяется скользкий слайдер. Чего я хочу добиться здесь, так это поместить гладкие точки в скользящие блоки div. У меня не было проблем, чтобы добиться этого с помощью стрелок, так как я могу ссылаться на них с именами пользовательских классов.
Мой HTML выглядит так:

<div class="slider-fade">
 <div>
  <div class="text-box">
   <h2>Lorem ipsum</h2>
   ...additional text
  </div>
 </div>
 <div>
  <div class="text-box">
   <h2>Lorem ipsum</h2>
   ...additional text
  </div>
 </div>
 <div>
  <div class="text-box">
   <h2>Lorem ipsum</h2>
   ...additional text
  </div>
 </div>
</div>

Мои настройки JS выглядят так:

$('.slider-fade').slick({
 autoplay: true,
 autoplaySpeed: 3000,
 infinite: true,
 speed: 500,
 fade: true,
 cssEase: 'linear',
 prevArrow: $('.prev'),
 nextArrow: $('.next'),
 dots: true
});

Итак, как я уже говорил, точки отображаются под всемslider-fade класс, но я хочу получить его, например, нижеtext-box учебный класс. Это достижимо?

Визуальное представление:http://i.stack.imgur.com/jmocB.png

Цель состоит в том, чтобы получить точки ниже стрелок внутри блока.