исправлена ​​проблема с уменьшенными изображениями в slick-carousel - PullRequest
Новая
       24

исправлена ​​проблема с уменьшенными изображениями в slick-carousel

1 голос
/ 18 марта 2019

Я хочу показать миниатюры на гладкой карусели.Вот мой код инициализации: 

$('.regular').each(function() {
  var $this = $(this);
  if ($this.children().length > 1) {
    $this.slick({
      dots: true,
      arrows: true,
      infinite: true,
      slidesToShow: 1,
      slidesToScroll: 1,
      navs: true,
      customPaging: function(slider, i) {
        return '<div class="thumbnails">' + $(slider.$slides[i]).find('img').prop('outerHTML') + '</div>';
      }
    });
  }
});

Здесь я пытаюсь показать изображения в списке (показано здесь ).

Есть ли способ показатьизображения в виде карусели, чтобы он отображал только первые 4 миниатюрные изображения?

HTML-код: 

<section class="regular slider">
     <?php if(!empty($product->images) && $images[0]->published !== 0) {
         $start_image = VmConfig::get('add_img_main', 1) ? 0 : 1;
         for ($i = 0; $i < count($product->images); $i++) {
         $image = $product->images[$i];
     ?>

    <div class="item">
         <img  src=<?php echo' "'.JURI::root().$image->file_url.'"   '?>
               alt=<?php echo' "'.$image->file_title.'"   '?>
               data-thumb= '<img src=<?php echo'  "'.JURI::root().$image- 
               >file_url.'" '?>/>'   
          />                                 
    </div>
         <?php   }      
                     }  ?>
 </section >

спасибо

...