Tuesday, 18 September 2018

How to create jQuery fadeIn fadeOut Animation

How to create jQuery fadeIn fadeOut Animation

Html:
<ul>
<li class="client-testimonial"><img src="demo1.png"></li>
<li class="client-testimonial"><img src="demo2.png"></li>
<li class="client-testimonial"><img src="demo3.png"></li>
<li class="client-testimonial"><img src="demo4.png"></li>
</ul>


jQuery:

jQuery(document).ready(function(){
if(jQuery('.client-testimonial').length > 0){
var showImg = jQuery(".client-testimonial-img");
var quoteIndex = -1;

function showFadeInFadeOut() {
++quoteIndex;
showImg.eq(quoteIndex % showImg.length)
.fadeIn(2000)
.delay(2000)
.fadeOut(2000, showFadeInFadeOut);
}
showFadeInFadeOut();
}

});

1 comment:

  1. It's very useful blog post with informative and insightful content and i had good experience with this information.I have gone through CRS Info Solutions Home which really nice. Learn more details About Us of CRS info solutions. Here you can see the Courses CRS Info Solutions full list. Find Student Registration page and register now. Go through Blog post of crs info solutions. I just read these Reviews of crs really great. You can now Contact Us of crs info solutions. You enroll for Pega Training at crs info solutions.

    ReplyDelete