https://vyborsmartphona.ru/wp-content/themes/root/js/lightbox.js

1/**
2 * WPShop Lightbox
3 *
4 * @version   1.0
5 * @updated   2019-01-22
6 */
7
8(function(window, document, $) {
9    "use strict";
10
11    // jquery required
12    if (!$) return;
13
14    $.fn.wpshoplightbox = function(options) {
15        var selector;
16        var $this = $(this);
17
18        var container =
19                '<div class="wpshoplightbox-container" role="dialog" tabindex="-1">' +
20                '<div class="wpshoplightbox-bg"></div>' +
21                '<div class="wpshoplightbox-inner">' +
22                '<div class="wpshoplightbox-close"><svg width="17" height="17" xmlns="http://www.w3.org/2000/svg"><path fill="none" d="M-1-1h19v19h-19z"/><path fill="#fff" d="M8.485 7.071l-7.071-7.071-1.414 1.414 7.071 7.071-7.071 7.071 1.414 1.414 7.071-7.071 7.071 7.071 1.414-1.414-7.071-7.071 7.071-7.071-1.414-1.414-7.071 7.071z"/></svg></div>' +
23                '<div class="wpshoplightbox-body"><div class="wpshoplightbox-image"></div></div>' +
24                '<div class="wpshoplightbox-caption"></div>' +
25                "</div>" +
26                "</div>",
27            $container = $(container);
28
29        options = options || {};
30
31        // on click on link with href
32        $this.on('click', function(){
33
34            var $current = $(this);
35            var image_src = $current.attr('href');
36            var img = document.createElement("img"),
37                $img = $(img);
38
39            $img.attr('src', image_src);
40
41
42            // append container
43            var box = $container.appendTo("body")[0];
44
45            // scroll disappear fix
46            $('head').append(
47                '<style id="wpshoplightbox-scroll-style" type="text/css">.wpshoplightbox-scroll{margin-right:' +
48                (window.innerWidth - document.documentElement.clientWidth) +
49                "px;}</style>"
50            );
51            $('body').addClass('wpshoplightbox-scroll');
52
53            // add image in lightbox
54            $container.find('.wpshoplightbox-image').html( $img );
55
56            // timeout need for animation
57            setTimeout(function(){
58                $container.addClass('wpshoplightbox--open');
59            }, 10);
60
61            return false;
62        });
63
64
65        $(document).on('click', '.wpshoplightbox-body, .wpshoplightbox-close', function() {
66            close();
67        });
68
69        function close() {
70            $(document).find('.wpshoplightbox-container').removeClass('wpshoplightbox--open');
71            setTimeout(function(){
72                $(document).find('.wpshoplightbox-container').remove();
73            }, 400);
74            $('body').removeClass('wpshoplightbox-scroll');
75            $("#wpshoplightbox-scroll-style").remove();
76        }
77
78    };
79
80})(window, document, jQuery);