https://www.portoseguro.org.br/resources/js/sliders.js

1
2
3const Slider = function (selector, options = {}) {
4    this.element = document.querySelector(selector)
5    
6    if (this.element) {
7      this.dom = {
8        cards: this.element.querySelector('.slider__cards')
9      }
10
11      this.options = options 
12
13      this.init()
14    }
15  
16  }
17  
18  Slider.prototype.init = function () {
19    const cards = this.dom.cards;
20    
21    let groupCells = 1;
22    let cellAlign = 'center';
23  
24    if (window.innerWidth > 996) {
25      groupCells = this.options.groupCells;
26      cellAlign = 'left';
27      
28    }
29  
30    if (cards) {
31      const arrorLeft = this.element.querySelector('.slider__arrow--left')
32      const arrorRight = this.element.querySelector('.slider__arrow--right')
33
34      const flk = new Flickity(cards, {
35        slideDots: false,
36        groupCells: groupCells,
37        freeScroll: true,
38        cellAlign: cellAlign,
39        pageDots: false,
40        prevNextButtons: false,
41      });
42
43      arrorLeft.addEventListener('click', function () {
44        flk.previous();
45      });
46
47      arrorRight.addEventListener('click', function () {
48        flk.next();
49      });
50    }
51  
52  }
53
54  ;(function load () {
55    
56    window.addEventListener('load', function() {
57      new Slider(".slider__outras-noticias", {
58        groupCells: 3
59      });
60    })
61  })();
62