Slick Slider - каждый слайд слайдера как собственный слайдер (слайдер генерируется в php) - PullRequest
Новая
       8

Slick Slider - каждый слайд слайдера как собственный слайдер (слайдер генерируется в php)

0 голосов
/ 14 ноября 2018

Я пытаюсь составить список актеров и каждого актера в виде списка фильмов (в котором они сыграли). У меня есть рабочий слайдер для актеров (с centerMode), и я хочу, чтобы, когда актер был в центре, у нас был слайдер для показа его фильма под ним. И когда мы идем к другому актеру, слайдер фильма меняется.

На данный момент, когда я раскомментирую ползунок для фильмов, ползунков больше нет (даже для актеров ...)

Вот мой код:

PHP Slider: 

//Actors slider (most of the time contains around 20 actors)
echo('<div class="caroussel">');

foreach ($persons as $person){
    echo('<div>');
    if($person->poster){
        //Poster display
        echo ("<div><a  href='" . $person->getShortCut() . "'><img src='http://image.tmdb.org/t/p/w500$name->poster'></a></div>");

        /* Here the caroussel of the movie i want to create (Contains around 30 movies)

        echo('<div class="caroussel_personMovies asnavForClass">');
        foreach ($persons as $movie){

            //Poster display
            if($movie->poster){
                echo ("<div><a  href='" . $movie->getShortCut() . "'><img src='http://image.tmdb.org/t/p/w500$movie->poster'></a></div>");
            }

        }
        echo("</div>");
        */
    }
    echo('</div>');
}
echo("</div>");

JS: 

$(document).ready(function(){
    $('.caroussel').slick({
        infinite : true,
        slidesToShow: 10,
        slidesToScroll: 1,      
        //asNavFor: '.asnavForClass',
        centerMode: true,
        variableWidth: true,
        adaptiveHeight: true,
    })
    $('.caroussel_personMovies').slick({
        infinite : true,
        slidesToShow: 5,
        slidesToScroll: 3,      
        autoplay: true,
        autoplaySpeed: 5000,
        variableWidth: true,
        adaptiveHeight: true,
        pauseOnHover: true,
    })      
});

Любая помощь и комментарии будут благодарны, спасибо вам, ребята!

...