JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://unpkg.com/beerslider/dist/BeerSlider.css">
<div id="beer-slider" class="beer-slider" data-beer-label="ビフォー">
<img src="https://picsum.photos/400/300" alt="Original - Man holding beer">
<div class="beer-reveal" data-beer-label="アフター">
<img src="https://picsum.photos/401/300" alt="Processed - Man holding beer">
</div>
</div>
JavaScript
! function(t, e) {
"object" == typeof exports && "object" == typeof module ? module.exports = e() : "function" == typeof define && define.amd ? define([], e) : "object" == typeof exports ? exports.BeerSlider = e() : t.BeerSlider = e()
}(window, function() {
return function(t) {
var e = {};
function n(r) {
if (e[r]) return e[r].exports;
var o = e[r] = {
i: r,
l: !1,
exports: {}
};
return t[r].call(o.exports, o, o.exports, n), o.l = !0, o.exports
}
return n.m = t, n.c = e, n.d = function(t, e, r) {
n.o(t, e) || Object.defineProperty(t, e, {
enumerable: !0,
get: r
})
}, n.r = function(t) {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(t, Symbol.toStringTag, {
value: "Module"
}), Object.defineProperty(t, "__esModule", {
value: !0
})
}, n.t = function(t, e) {
if (1 & e && (t = n(t)), 8 & e) return t;
if (4 & e && "object" == typeof t && t && t.__esModule) return t;
var r = Object.create(null);
if (n.r(r), Object.defineProperty(r, "default", {
enumerable: !0,
value: t
}), 2 & e && "string" != typeof t) for (var o in t) n.d(r, o, function(e) {
return t[e]
}.bind(null, o));
return r
}, n.n = function(t) {
var e = t && t.__esModule ? function() {
return t.
default
} : function() {
return t
};
return n.d(e, "a", e), e
}, n.o = function(t, e) {
return Object.prototype.hasOwnProperty.call(t, e)
}, n.p = "", n(n.s = 47)
}([function(t, e) {
t.exports = "undefined" != typeof window &&...