Tyoma Ti2019-10-29 10:50:33
Tyoma Ti, 2019-10-29 10:50:33

Slide centering mode for Slick Slider?

Friends, can you throw ready HTML / CSS / JS code for Slick Slider with single slide centering mode?
I can't find the complete code. That is, HTML / CSS, but no JS, that is, JS, but no CSS, then something else is missing.
For example, here such a slider is shown, and there is even a js code, but there is nothing else. And if I can pull out the HTML, then the CSS doesn't work.
I'm new to this stuff, so it's hard to figure it out myself. Thanks in advance!

Answer the question

In order to leave comments, you need to log in

3 answer(s)
Sergey delphinpro, 2018-09-06

What animation? Scrolling or what?

  top: 1000,
  behavior: 'smooth'

Adilet Zhuman, 2018-09-06

This is called anchor links, there are many ways to implement this on the net) choose the one that best suits your task.

Alams Stoyne, 2019-10-29

or connect from CDN

<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.css"/>
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>

Don't forget to include jQuery first, like so:

More HTML Slider
<div class="my-slider">
  <div class="item-slide">SLIDE 1</div>
  <div class="item-slide">SLIDE 2</div>
  <div class="item-slide">SLIDE 2</div>

More JavaScript
<script type="text/javascript">
  centerMode: true,
  centerPadding: '60px',
  slidesToShow: 3,
  autoplay: true,
  autoplaySpeed: 2000,

In general, learn English and look at the official documentation
Everything is simple and clear - there will be questions to write.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question