Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
- <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
- <script>
- (function () {
- // Id блока, в котором будет слайдер
- let block = $("#rec264291430");
- // Class элемента, в котором будет находиться слайдер
- let wrap = $(".tn-elem__2642914301608710942777");
- // Id блоков, которые будут слайдами
- let slides = $("#rec264310309,#rec265555785,#rec265556823,#rec265558175, #rec265558702,#rec265559000,#rec265559325,#rec265559792, #rec265560040");
- wrap.addClass("tildoshnaya-slider-owl");
- let box = wrap.find(".tn-atom");
- box.append('<div class="owl-carousel owl-theme"></div>');
- slides.appendTo(block.find('.owl-carousel'));
- let owl = wrap.find('.owl-carousel').owlCarousel({
- // Зациклить слайдер - true
- // Без зацикленности - false
- loop:true,
- nav:false,
- dots: false,
- // Колличество карточек
- items: 1,
- // Адаптивность
- responsive:{
- // 0 это минимальная ширина экрана, при которой включается следующая часть кода
- // 0:{
- // items: 1 это колличество слайдов на экране
- // items:1
- // },
- 120:{
- items:1
- },
- 640:{
- items:1
- },
- 960:{
- items:1
- },
- }
- // Адаптивность: конец
- })
- block.find("[href='#slider_left']").click(function(){
- owl.trigger('prev.owl.carousel');
- })
- block.find("[href='#slider_right']").click(function(){
- owl.trigger('next.owl.carousel');
- })
- }());
- </script>
- <style>
- /* tildoshnaya_ */
- .tildoshnaya-slider-owl .t-rec .t396__artboard {
- /* Указываем высоту слайда */
- height: 456px !important;
- /* Указываем ширину слайда */
- width: 1145px !important;
- }
- .tildoshnaya-slider-owl {
- display: flex;
- flex-flow: row nowrap;
- justify-content: center;
- align-items: stretch;
- align-content: stretch;
- }
- </style>
Advertisement
Add Comment
Please, Sign In to add comment