https://tengo.se/js-tengo/js-articlegroup/carousel.js

1visibleClass = 'visible';
2hiddenClass = 'hidden';
3
4$(window).on("load resize", function (e) {
5    // Divs from DOM
6    var carouselWrapper = $(".carousel-js .articlegroupsublist table tbody tr");
7    var carouselItem = $(".carousel-js .articlegroupsublist table tbody tr td");
8    var carouselNavNext = $(".carousel-btn.next");
9    var carouselNavPrev = $(".carousel-btn.prev");
10
11    // Fetching sizes
12    var carouselWrapperWidth = carouselWrapper.outerWidth();
13    var carouselItemWidth = carouselItem.outerWidth();
14
15    // Calculating sizes
16    var carouselItemCount = carouselItem.length;
17    var carouselItemShown = carouselWrapperWidth / carouselItemWidth;
18    var carouselItemHidden = carouselItemCount - carouselItemShown;
19
20    // Init position on load/resize
21    var carouselPosition = carouselWrapper.scrollLeft();
22
23    // Init hide nav btns
24    //carouselNavPrev.hide();
25    //carouselNavNext.hide();
26    carouselNavPrev.addClass(hiddenClass).removeClass(visibleClass);
27    carouselNavNext.addClass(hiddenClass).removeClass(visibleClass);
28
29    // Init show next navigation if items not fit container
30    if (carouselItemHidden > 0) {
31        //carouselNavNext.show();
32        //carouselNavPrev.show();
33        //carouselNavNext.show();
34        carouselNavNext.addClass(visibleClass).removeClass(hiddenClass);
35    }
36    // Hide both if all items fit container
37    else {
38        //carouselNavPrev.hide();
39        //carouselNavNext.hide();
40    };
41
42
43
44    // Init show prev 
45    if (carouselPosition > 0) {
46        //carouselNavPrev.show();
47        carouselNavPrev.addClass(visibleClass).removeClass(hiddenClass);
48    }
49
50    // Function for scroll event
51    carouselWrapper.scroll(function () {
52        var carouselPosition = carouselWrapper.scrollLeft();
53
54        // Hide Previous btn
55        if (carouselPosition < carouselItemWidth) {
56            //carouselNavPrev.hide();
57            carouselNavPrev.addClass(hiddenClass).removeClass(visibleClass);
58        }
59        // Show Previous btn
60        else {
61            //carouselNavPrev.show();
62            carouselNavPrev.addClass(visibleClass).removeClass(hiddenClass);
63        };
64
65        // Hide Next btn
66        if (carouselPosition >= carouselItemWidth * carouselItemHidden - carouselItemWidth/2) {
67            //carouselNavNext.hide();
68            carouselNavNext.addClass(hiddenClass).removeClass(visibleClass);
69        }
70        // Show Next btn
71        else {
72            //carouselNavNext.show();
73            carouselNavNext.addClass(visibleClass).removeClass(hiddenClass);
74        };
75    })
76
77    // Function for next-tbn
78    carouselNavNext.click(function () {
79        carouselPosition = carouselPosition + carouselItemWidth * carouselItemShown;
80        carouselWrapper.scrollLeft(carouselPosition);
81
82    });
83    // Function for previous-btn
84    carouselNavPrev.click(function () {
85        carouselPosition = carouselPosition - carouselItemWidth * carouselItemShown;
86        carouselWrapper.scrollLeft(carouselPosition);
87    });
88});