Q:

How can I use the index of this image carousel to return the actual image? 

I've been trying for a few hours to select the center image (or current image) in my carousel.  Once selected, I'd like to display the same image in a center-of-screen view-port; think scrolling through photo previews while the current photo is in a larger display.  As you scroll, the center image is dynamically changing so the view port will too. 
Here is my HTML where I'm trying to propogate said carousel image; the view port:
<div class="col-md-6" style="height:480px;border:1px solid #fff">
     <div id="view-port">
     </div>
</div>

The closest I've gotten to something successful is:
window.onload = function() {
    var centerSlide = document.createElement("img");
    centerSlide.src = $('#myCarousel').slick('slickCurrentSlide');
    document.getElementById("view-port").appendChild(centerSlide);
    console.log(centerSlide);
};

Which logs
<img src="0">

as expected, the index of the currentSlide.  This can be observed here:
https://jsfiddle.net/positivecharge8/nddaj84x/
But I can't figure out how to get the image so I can reference it to put into a div.  I understand that the code that I have now won't dynamically change the view port div image as I scroll through the carousel- that's okay, for now I'd like to at least get some image up there.  Thanks! 

A:

Using $('#myCarousel').slick('slickCurrentSlide'); gets you the index of the current image not the src of the image.  Use jQuery's prop function to get the src of the image. 
The following will find the current slide, and then get its src and use it for the new image's src.  
var centerSlide = document.createElement("img");
centerSlide.src = $('#shoe-carousel .slick-current img').prop('src');
document.getElementById("view-port").appendChild(centerSlide);

Here is a working example: https://jsfiddle.net/4g4wbj1g/8/
To make the centerSlide update on slide change I would look into using the afterChange event.  There is some good documentation here: http://kenwheeler.github.io/slick/

