Slick carousel переход на страницу window.location.href не работает

210
15 марта 2018, 11:31

есть карусель на Slick появилась идея при просмотре последнего слайда сделать переход на определённую страницу попробовал такой вариант

infinite: true заменил на false

и добалил код

$('.slick-next.slick-disabled').on('click',function(){

window.location.href('http://test.web-devsoltan.com/personazhi/'); });

Почему не срабатывает код?

[codepen]1

1:

jQuery(document).ready(function($) { 
  $('.hero-carousel').slick({ 
    centerMode: false, 
    infinite: flase, 
    slidesToShow: 3, 
    arrows: true, 
    prevArrow: '<span class="icon-angle-left"></span>', 
    nextArrow: '<span class="icon-angle-right"></span>' 
 
 
  }); 
 
  $('.slick-next.slick-disabled').on('click', function() { 
 
    window.location.href('http://test.web-devsoltan.com/personazhi/'); 
  }); 
 
});
<script src="https://test.web-devsoltan.com/wp-content/themes/entertainment/libs/slick/slick.min.js"></script> 
<script src="https://test.web-devsoltan.com/wp-includes/js/jquery/jquery.js"></script> 
<link href="https://test.web-devsoltan.com/wp-content/themes/entertainment/style.css" rel="stylesheet" /> 
<link href="https://test.web-devsoltan.com/wp-content/themes/entertainment/libs/slick/slick.css" rel="stylesheet" /> 
 
 
<section class="hero"> 
  <div class="section_title"> 
    <h2>Наши герои</h2> 
  </div> 
  <div class="grid-container"> 
    <div class="grid-x grid-padding-x grid-margin-x hero-carousel"> 
 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1.jpg 320w, http://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2.jpg 320w, http://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero3.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero3.jpg 320w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero3-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero3-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero4.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero4.jpg 320w, http://test.web-devsoltan.com/wp-content/uploads/2018/01/hero4-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero4-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1.jpg 320w, http://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero1-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
      <div class="slick-slider-item cell medium-6"> 
        <img width="320" height="320" src="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2.jpg" class="attachment-full size-full" alt="" srcset="https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2.jpg 320w, http://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2-150x150.jpg 150w, https://test.web-devsoltan.com/wp-content/uploads/2018/01/hero2-300x300.jpg 300w" 
          sizes="(max-width: 320px) 100vw, 320px" /> 
        <p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> 
      </div> 
 
    </div> 
  </div> 
</section>

READ ALSO
Показать все метки на Яндекс карте

Показать все метки на Яндекс карте

Для загрузки объектов на карту использую следующий скрипт

181
JSON одинарные кавычки

JSON одинарные кавычки

ЗдравствуйтеВстречаю два различных типа файлов JSON в различной литературе по этому формату

222
Поиск подстроки и скобочных групп

Поиск подстроки и скобочных групп

Я пытаюсь найти целую строку и все скобочные группыЯ хочу сделать это в строке:

178
Не выполняется третье условие else if

Не выполняется третье условие else if

Не выполняется третье условие else ifПервые два работают корректно

164