Skip to content

Instantly share code, notes, and snippets.

@kirandash
Last active April 29, 2017 09:55
Show Gist options
  • Save kirandash/61686f8d6e8a61fa0511d8098401428e to your computer and use it in GitHub Desktop.
Save kirandash/61686f8d6e8a61fa0511d8098401428e to your computer and use it in GitHub Desktop.
Slick image and video fade effect
(function($){
/********************************
* Banner Home *
********************************/
$('#banner-home').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
fade: true,
autoplay: true,
autoplaySpeed: 3000,
dots: true
});
$('#banner-home').on('afterChange', function(event, slick, currentSlide){
if ($("#banner-home .slick-current .banner-video").length) {
$('#banner-home').slick('slickPause');
$("#banner-home .slick-current .banner-video video")[0].play();
}
});
$(".banner-video video").bind("ended", function() {
// Continue slick movement and go to next slide
$('#banner-home').slick('slickPlay');
$('#banner-home').slick('slickNext');
});
})(jQuery)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment