I use slick slider. When choosing a slide or just scrolling in the thumbnails section, for some reason it throws a block with slides very far away, I can’t understand why, just like the width of the slides. Js

jQuery(document).ready(function($){ $('.cool-slider').slick({ slidesToShow: 1, autoplay: false, slidesToScroll: 1, asNavFor: '.cool-slider-nav', nextArrow: '<a class="right carousel-control custom-ico-slide"><i class="demo-icon icon-right-open-big" aria-hidden="true"></i></a>', prevArrow: '<a class="left carousel-control custom-ico-slide"><i class="demo-icon icon-left-open-big" aria-hidden="true"></i></a>', fade: true }) $('.cool-slider-nav').slick({ slidesToScroll: 1, autoplay: false, asNavFor: '.cool-slider', focusOnSelect: true, infinite : false, arrows: false, dots: true, appendDots: $(".caption-wrapper") }); });

I leave the problem with the slider by the link. I will not reset the html and css codes. Please indicate what my error is http://blackfoxrealty.com/agents/john-johnson/

    1 answer 1

    With the version that you have now cool-slider-nav you do not need a slider. You have all 6 slides fit on one screen. And therefore these slides serve as custom dots , but definitely not a slider. Double their width and see a normal result.