https://pharmamex.com.mx/ext/multicolor/multicolor.js

1	$(function() {
2        var color_attributes = $('body').find('.color_attributes input');
3        $(document).on('change','.color_attributes input', function (event) {
4            event.preventDefault();
5            var color_id = $('input[name=color_id]').val();
6            var currAttrIid = $(this).parents('.color_attributes').find('input[name=id_color]').val();
7            // change select and refresh it and recalculate summ after changing image of color
8            $('#select_id_' + currAttrIid).val($(this).val());
9            $('#select_id_' + currAttrIid).change();
10            var currColId = color_id;
11            if($('#select_id_' + color_id).length > 0){
12                currColId = $('#select_id_' + color_id).val();//need for save images gallery
13            }
14            //show black border around chosen color
15            $(this).parents('.color_attributes').find('label').removeClass('active');
16            $(this).parent().addClass('active');
17 //     $('#select_id_'+color_id).multiselect('refresh');
18
19      
20			$.get('./includes/modules/additional_images2.php', {
21				method: 'ajax',
22				pid: jQuery("input[name=products_id]").val(),
23				colid: color_id,
24				col: currColId,
25                tpl:$('#modal').val(),
26				color_images: jQuery("#color_images").val()
27			}, function(obj) {
28				jQuery('.additional_images2').html(obj).promise().done(function() {
29          var sync1 = $("#sync1");
30					var isSyncedCarousels = $('#sync1_1').length ? true : false;
31          var isNewSyncedCarousels = $('#product_big_slider').length ? true : false;
32          
33          $("#sync1 .lazyload, .additional_images2 .lazyload, #sync1_1 .lazyload, #product_big_slider .lazyload").lazyload();
34          
35          if (isSyncedCarousels && typeof syncedCarousel === 'function') {
36              carouselClass = new syncedCarousel('#sync1_1','#sync2');
37          } else if (isNewSyncedCarousels && typeof syncedCarousel === 'function'){
38              carouselClass = new syncedCarousel('#product_big_slider','#product_small_slider');
39          } else{
40            $("#sync1").owlCarousel({
41                items: 1,
42                loop: true,
43                dots: true,
44                slideSpeed: 200,
45                nav: true,
46                navText: ['<i class="fa fa-chevron-left"></i>', '<i class="fa fa-chevron-right"></i>'],
47                dotsContainer: '#sync2',
48                responsiveRefreshRate: 200
49            });
50          }
51                    if((typeof carouselClass!="undefined" && typeof syncedCarousel!="undefined") && $('#modal').val()){
52                        var sync1 = $('#sync1'), sync2 = $('#sync2');
53                        carouselClass = new syncedCarousel(sync1, sync2)
54                    }
55				});
56			});
57		});
58
59	});