Как сделать слайдер?

Question

[Leha Lepeha]

Нужно сделать слайдер, но не знаю как. И owl-carousel пробовал и другие плагины, но все равно не работает, и в чем ошибка тоже не могу понять
Вот кусок HTML кода:

<section class="about">
					<div class="container">
						<div class="about__top">
							<div class="about__tittle">
								<div class="about__tittle about__tittle-top">
									<h1 class="about__tittle about__tittle-top">ABOUT US</h1>
								</div>
								<div class="about__tittle about__tittle-middle">
									<img src="images/line.png" alt="" class="services__tittle services__tittle-img tittle__line">
								</div>
								<div class="about__tittle about__tittle-desc">
									<p class="about__tittle about__tittle-desc">We offer ipsum dolor sit amet, consetetur sadipscing elitr amet</p>
								</div>
							</div>
						</div>
						<div class="about__middle">
							<div class="about__middle-left">
								<p class="about__middle-left">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sediam nonumy eirmod tempor invidunt ut labore et dolore aliquyam erat, sed diam voluptua. At vero eos et accusam et justo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor et dolore aliquyam erat. Lorem ipsum dolor sit amet. Lorem ipsum eat.</p>
							</div>
							<div class="about__middle-right">
								<p class="about__middle-right">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sediam nonumy eirmod tempor invidunt ut labore et dolore aliquyam erat, sed diam voluptua. At vero eos et accusam et justo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor et dolore aliquyam erat. Lorem ipsum dolor sit amet. Lorem ipsum eat.</p>
							</div>
						</div>
						<div class="about__bottom">
							<ul class="about__slider">
								<li class="slider__item"><a href="#" class="slider__item slider__link">
									<img src="images/slider1.png" alt="" class="slider-img"></a>
								</li>
								<li class="slider__item">
									<a href="#" class="slider__item slider__link">
										<img src="images/slider2.png" alt="" class="slider-img">
									</a>
								</li>
								<li class="slider__item">
									<a href="#" class="slider__item slider__link">
										<img src="images/slider3.png" alt="" class="slider-img">
									</a>
								</li>
								<li class="slider__item">
									<a href="#" class="slider__item slider__link">
										<img src="images/slider4.png" alt="" class="slider-img">
									</a>
								</li>
							</ul>
						</div>
					</div>
				</section>

Вот, что нужно сделать:

Comments

[Dymok]

Так а что не работает? С одной лишь html-разметкой оно явно не будет работать. Залейте на codepen вместе с JS и CSS

[Leha Lepeha]

Dymok, так понятно, что с одним html не будет работать, просто, что нужно сделать для слайдера?

[Eugene Chefranov]

Leha Lepeha, подключить его и инициализировать

[alex]

Leha Lepeha, ну вы может хотябы скажете что у вас за слайдер? как вы его инициализируете? раскроете более детально эту фразу блондинки «но все равно не работает»? может вам стоит посмотреть в консоль браузера? зачем вы кидаете эту разметку с неправильным бэмом, толку от нее ноль? если вы не хотите думать головой и не в состоянии понятно донести до окружающих проблему, чтобы они вам помогли, не в состоянии прочитать документацию к слайдеру, может тогда это не ваше? может не стоит этим заниматься?

[Leha Lepeha]

Eugene Chefranov, может напишите простой скелет на HTML, и покажите как подключить и инициализировать?

[alex]

Leha Lepeha, что из этого вам не понятно?

[Leha Lepeha]

Alex, хорошо, попытаюсь сам разобраться, но скажите тогда где ошибки с БЭМом в коде, я пока начинающий в этом и многого не знаю

[alex]

Leha Lepeha, забудьте про бэм пока, покажите как вы инициализируете слайдер

[Leha Lepeha]

Alex, здесь написано про Webpack, но я использую gulp, что делать? https://github.com/OwlCarousel2/OwlCarousel2

[Алексей Пахомов]

Вот накидал простенький с бесконечной прокруткой Codepen Slider. Из настройки поставить 2 селектора - контейнера и слайда. Количество элементов на странице настраивается через css, поэтому с адаптивом на разные экраны вообще без проблем.

[Leha Lepeha]

RiverMacaroon0, спасибо большое