Slick: beforeChange (and afterChange) bubble

[lewishowles]

http://jsfiddle.net/L1c949zf/1/

In the following setup, where each slide of .slider contains its own .sub-slider, currentSlide is logged to the console whenever either slider changes.

$(".slider").slick({
    autoplay: true,
    autoplaySpeed: 4000,
    dots: true
});

$(".sub-slider").slick({
    autoplay: true,
    autoplaySpeed: 1000,
    dots: false,
    arrows: false
});

$(".slider").on('beforeChange', function(event, slick, currentSlide) {
    console.log(currentSlide);
});

The only way I can think, currently, to ensure that it's the .slider element that has changed is something like

$(".slider").on('beforeChange', function(event, slick, currentSlide) {
    if ($(slick.$slider).hasClass('slider')) {
        console.log(currentSlide);
    }
}

[simeydotme]

I'm not quite sure what you're asking... but your users will not thank you if you nest sliders.

[lewishowles]

I'm not asking anything, I'm reporting a bug. 'Don't do it' is hardly a constructive response.

[kenwheeler]

It's not a big, it called an event bubble

[kenwheeler]

Bug*, it's *

[kenwheeler]

You can check the target to differentiate

[kenwheeler]

You can also cancel the bubble in a listener on the sub slider

[lewishowles]

Your last two replies would have sufficed without the snarky comments.

[kenwheeler]

Sorry