https://www.zaboblue.com/wp-content/themes/aizomezabo/common/jquery.twentytwenty.js?ver=7.1.2

1(function($){
2
3  $.fn.twentytwenty = function(options) {
4    var options = $.extend({default_offset_pct: 0.5}, options);
5    return this.each(function() {
6
7      var sliderPct = options.default_offset_pct;
8      var container = $(this);
9      
10      container.wrap("<div class='twentytwenty-wrapper'></div>");
11      container.append("<div class='twentytwenty-overlay'></div>");
12      var beforeImg = container.find("img:first");
13      var afterImg = container.find("img:last");
14      container.append("<div class='twentytwenty-handle'></div>");
15      var slider = container.find(".twentytwenty-handle");
16      slider.append("<span class='twentytwenty-left-arrow'></span>");
17      slider.append("<span class='twentytwenty-right-arrow'></span>");
18      container.addClass("twentytwenty-container");
19      beforeImg.addClass("twentytwenty-before");
20      afterImg.addClass("twentytwenty-after");
21      
22      var overlay = container.find(".twentytwenty-overlay");
23      overlay.append("<div class='twentytwenty-before-label'></div>");
24      overlay.append("<div class='twentytwenty-after-label'></div>");
25
26      var calcOffset = function(widthPct) {
27        var w = beforeImg.width();
28        var h = beforeImg.height();
29        return {
30          w: w+"px",
31          h: h+"px",
32          cw: (widthPct*w)+"px"
33        };
34      };
35
36      var adjustContainer = function(offset) {
37        beforeImg.css("clip", "rect(0,"+offset.cw+","+offset.h+",0)");
38        container.css("height", offset.h);
39      };
40
41      var adjustSlider = function(pct) {
42        var offset = calcOffset(pct);
43        //slider.css("height", offset.h);
44        slider.css("left", offset.cw);
45        adjustContainer(offset);
46      }
47
48      $(window).on("resize.twentytwenty", function(e) {
49        adjustSlider(sliderPct);
50      });
51
52      var offsetX = 0;
53      var imgWidth = 0;
54      
55      container.on("movestart", function(e) {
56        if ((e.distX > e.distY && e.distX < -e.distY) || (e.distX < e.distY && e.distX > -e.distY)) {
57          e.preventDefault();
58        }
59        container.addClass("active");
60        offsetX = container.offset().left;
61        imgWidth = beforeImg.width();          
62      });
63
64      container.on("moveend", function(e) {
65        container.removeClass("active");
66      });
67
68      container.on("move", function(e) {
69        if (container.hasClass("active")) {
70          sliderPct = (e.pageX-offsetX)/imgWidth;
71          if (sliderPct < 0) {
72            sliderPct = 0;
73          }
74          if (sliderPct > 1) {
75            sliderPct = 1;
76          }
77          adjustSlider(sliderPct);
78        }
79      });
80
81      container.find("img").on("mousedown", function(e) {
82        event.preventDefault();
83      });
84
85      $(window).trigger("resize.twentytwenty");
86    });
87  };
88
89})(jQuery);