JSFiddle - React, Tailwind, and code Playground
by luka kupunia
JavaScript
! function(T) {
function e(e, n) {
var t = e.find(".premium-hscroll-wrap"),
o = t.data("settings"),
i = o.templates;
i.length && (i.forEach(function(e) {
"id" !== e.template_type || "" === e.section_id || n("#" + e.section_id).length || t.html('<div class="premium-error-notice"><span>Section with ID <b>' + e.section_id + "</b> does not exist on this page. Please make sure that section ID is properly set from section settings -> Advanced tab -> CSS ID.<span></div>")
}), new premiumHorizontalScroll(t, o).init())
}
window.premiumHorizontalScroll = function(r, l) {
var a = this,
i = l.id,
s = l.templates.length,
t = elementorFrontend.isEditMode(),
o = elementorFrontend.getCurrentDeviceMode(),
c = 300,
d = [],
m = 0,
u = -1,
n = l.loop,
f = "snap" === l.snap,
p = !1,
h = !1,
v = null,
g = null,
w = null,
C = l.rtl,
S = null;
r.find(".premium-hscroll-temp").each(function(e, n) {
-1 < T(n).data("hide").indexOf(o) && function(e, n) {
0 !== s && (s--, T(e).remove(), r.find(".premium-hscroll-total-slides").html(9 < s ? s : "0" + s), r.find('.premium-hscroll-nav-item[data-slide="section_' + i + n + '"]').remove());
0 === s && r.find(".premium-hscroll-arrow, .premium-hscroll-nav, .premium-hscroll-pagination").remove();
l.opacity && r.find(".premium-hscroll-temp:first").removeClass("premium-hscroll-hide")
}(n, e)
});
var y = r.find(".premium-hscroll-temp");
if (l.opacity) var k = 0;
C && (k = s - 1), "desktop" !== o ? (f && l.disableSnap && (f = !1, l.enternace = !1), "tablet" === o ? c = 100 : "mobile" === o && (c = 50)) : f && (c = 30);
var A = T(".premium-hscroll-nav-item", r),
e = T(".premium-hscroll-wrap-icon", r);
a.init = function() {
s && (a.setLayout(), a.setSectionsData(), a.handleAnimations(), a.setScene(), n || a.checkActive(), v.on("progress",...