针对淡入淡出的定时轮播效果js

如果不使用jquery的fadeIn和fadeOut的接口和不适用animate情况下，如果要做用js实现淡入淡出轮播效果，我所想到的办法就是使用css3新特性transition（注意好兼容性）。

先定义好两个class名，有分别有淡入bannerli0，和淡出的效果bannerli1。再用js定时器，让其类名替换。

（没有什么特别的难点，就是要循环注意好~）

var show = new function(){

var i = 0;
setInterval(function(){

if(!hasClass(Bannerli[i],"bannerli0")){
    removeClass(Bannerli[i],"bannerli1");
    addClass(Bannerli[i],"bannerli0");

++i;
if(i==Bannerli.length){i=0};
    removeClass(Bannerli[i],"bannerli0");
    addClass(Bannerli[i],"bannerli1");

if(i > (Bannerli.length)){
    return;
            }    
        }
    },2500)

}

　　

转载于:https://www.cnblogs.com/Yirannnnnn/p/4846435.html