jQuery Cycle2 non-active parent of nested slideshow not hidden

Question

I'm trying to set up nested slideshows with the cycle2 jQuery plugin, and I'm having an issue with the non-active slides of the parent not hiding properly when the parent slide is changed. I'm using the code from the demo:

<div class="cycle-slideshow" id="slideshow"
    data-cycle-fx="fade"
    data-cycle-slides="> div" 
    data-cycle-timeout=0 
    data-cycle-speed=250
    data-cycle-prev="#prev"
    data-cycle-next="#next">
<div>
    <div class="cycle-slideshow inner-slideshow"
        data-cycle-fx="tileSlide"
        data-cycle-timeout=3000
        data-cycle-loop=1>
        <img src="http://malsup.github.io/images/beach1.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach2.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach3.jpg" width="200" height="200">
    </div>
</div>

<div class="small">
    <div class="cycle-slideshow inner-slideshow"
        data-cycle-fx="scrollHorz"
        data-cycle-timeout=0
        data-cycle-loop=1>
        <img src="http://malsup.github.io/images/beach4.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach5.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach6.jpg" width="200" height="200">
    </div>
</div>

<div>
    <div class="cycle-slideshow inner-slideshow"
        data-cycle-fx="fadeOut"
        data-cycle-timeout=0
        data-cycle-loop=1>
        <img src="http://malsup.github.io/images/beach7.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach8.jpg" width="200" height="200">
        <img src="http://malsup.github.io/images/beach9.jpg" width="200" height="200">
    </div>
</div>

I've set up a fiddle using the code from the demo which is clearer:

http://jsfiddle.net/cfu5yp2r/

When the parent uses scrollHorz or scrollVert you don't really notice (though the non-active slides are still there), but when you use a fade effect you can see the active images from the children which are in the non-active slides of the parent stick around, somehow over the top. For me the issue was that my navigation and text content in my parent slides weren't clickable no matter what I did with z-indexes.

It's best illustrated by clicking-and-dragging over the slideshow - you'll see the image that drags away isn't actually the current slide. Or using a web inspector you'll see the image you find on top isn't the 'live' one in the slideshow.