Actually you need to do this: 
I'm trying to do this: 1. I made the markup and display the preview in the main window. 2. Connect the owl-carousel and try to associate the script with the output and the carousel.
$('.item>img').click(function() { var src = $(this).prop('src'); $('#big_img').html('<img src="' + src + '">'); }); //При клике по изображению из карусели, вывожу в .big_img фотографию. $("#owl-demo-tovar").owlCarousel({ items: 3, itemsDesktop: [1199, 3], itemsDesktopSmall: [979, 3], lazyLoad: true, autoPlay: false, mouseDrag: false, addClassActive: true }); //Сам скрипт OWL-Carousel <div id="big_img">Вывожу сюда основное фото большого размера</div> <div id="owl-demo-tovar"> <div class="item"> <img class="lazyOwl" src="<?php echo $image['thumb']; ?>" /> </div> <div class="item"> <img class="lazyOwl" src="<?php echo $image['thumb']; ?>" /> </div> <div class="item"> <img class="lazyOwl" src="<?php echo $image['thumb']; ?>" /> </div> </div> How to make sure that the second element is always active (even when scrolling through slides), which is in the center? And so that he was immediately displayed in the block with a large photo. I would be very grateful for the help. From jQuery to "you," I ask for help.
