"Simple animate images fadeIn from one to another jQuery"
Bootstrap 4.1.1 Snippet by KrishnaPraveenVemuri

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <section id="product"> <article class="product"> <img src="https://www.vdr.com.ua/images/prod/2012/20121016135516.jpg" /> </article> </section>
var images = []; images[0] = "https://www.vdr.com.ua/images/prod/2012/20121016135516.jpg"; images[1] = "https://www.zmm-tos.bg/images/stories/virtuemart/product/%D0%951.jpg"; images[2] = "http://www.stomana.org.ua/img/product/2012/24-stanok-Stomana-FS-32-N.jpg"; var i = 0; setInterval(fadeDivs, 4000); function fadeDivs() { i = i < images.length ? i : 0; console.log(i) $('.product img').fadeOut(100, function(){ $(this).attr('src', images[i]).fadeIn(100); }) i++; }

Related: See More


Questions / Comments: