Advertisement
oscarviedma

Swiper js - Ejercicio hover categorías

Feb 18th, 2021
605
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.11 KB | None | 0 0
  1. <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css" />
  2. <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
  3.  
  4. <script>
  5. jQuery(function($){
  6. // Insertar la paginacion swiper js
  7. $( "<div class='swiper-pagination'></div>" ).insertAfter( ".swiper-wrapper" );
  8.  
  9. // Insertar navegación (flechas) swiper js
  10. $( "<div class='swiper-button-next'></div><div class='swiper-button-prev'></div>" ).insertAfter( ".swiper-wrapper" );
  11. });
  12. </script>
  13.  
  14. <script>
  15. jQuery(document).ready(function( $ ) {
  16. var ovSliderCat = new Swiper(".ov-slider-cat-01", {
  17. slidesPerView: 1,
  18. slidesPerGroup: 1,
  19. spaceBetween: 0,
  20. pagination: {
  21. el: '.swiper-pagination',
  22. clickable: true,
  23. },
  24. navigation: {
  25. nextEl: '.swiper-button-next',
  26. prevEl: '.swiper-button-prev',
  27. },
  28. breakpoints: {
  29. 640: {
  30. slidesPerView: 2,
  31. },
  32. 768: {
  33. slidesPerView: 3,
  34. },
  35. 1024: {
  36. slidesPerView: 4,
  37. },
  38. 1200: {
  39. slidesPerView: 5,
  40. },
  41. }
  42. });
  43. });
  44. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement