VKirill

Untitled

Dec 30th, 2020
280
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.43 KB | None | 0 0
  1. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
  2. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
  3. <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
  4.  
  5. <script>
  6. (function () {
  7. // Id блока, в котором будет слайдер
  8. let block = $("#rec264291430");
  9. // Class элемента, в котором будет находиться слайдер
  10. let wrap = $(".tn-elem__2642914301608710942777");
  11. // Id блоков, которые будут слайдами
  12. let slides = $("#rec264310309,#rec265555785,#rec265556823,#rec265558175, #rec265558702,#rec265559000,#rec265559325,#rec265559792, #rec265560040");
  13.  
  14. wrap.addClass("tildoshnaya-slider-owl");
  15. let box = wrap.find(".tn-atom");
  16. box.append('<div class="owl-carousel owl-theme"></div>');
  17. slides.appendTo(block.find('.owl-carousel'));
  18. let owl = wrap.find('.owl-carousel').owlCarousel({
  19. // Зациклить слайдер - true
  20. // Без зацикленности - false
  21. loop:true,
  22. nav:false,
  23. dots: false,
  24. // Колличество карточек
  25. items: 1,
  26.  
  27. // Адаптивность
  28. responsive:{
  29. // 0 это минимальная ширина экрана, при которой включается следующая часть кода
  30. // 0:{
  31. // items: 1 это колличество слайдов на экране
  32. // items:1
  33. // },
  34. 120:{
  35. items:1
  36. },
  37. 640:{
  38. items:1
  39. },
  40. 960:{
  41. items:1
  42. },
  43. }
  44. // Адаптивность: конец
  45. })
  46.  
  47.  
  48. block.find("[href='#slider_left']").click(function(){
  49. owl.trigger('prev.owl.carousel');
  50. })
  51. block.find("[href='#slider_right']").click(function(){
  52. owl.trigger('next.owl.carousel');
  53. })
  54. }());
  55. </script>
  56.  
  57.  
  58.  
  59. <style>
  60. /* tildoshnaya_ */
  61. .tildoshnaya-slider-owl .t-rec .t396__artboard {
  62. /* Указываем высоту слайда */
  63. height: 456px !important;
  64. /* Указываем ширину слайда */
  65. width: 1145px !important;
  66. }
  67. .tildoshnaya-slider-owl {
  68. display: flex;
  69. flex-flow: row nowrap;
  70. justify-content: center;
  71. align-items: stretch;
  72. align-content: stretch;
  73. }
  74. </style>
Advertisement
Add Comment
Please, Sign In to add comment