Jquery fadeToggle()首先显示元素,然后显示fadeIn和Out

Jquery fadeToggle()首先显示元素,然后显示fadeIn和Out,jquery,fadein,setinterval,fadeout,Jquery,Fadein,Setinterval,Fadeout,嗨,我有这样一个代码,它以这种方式在预先终止的时间内循环: var array = [ "tip 01", "tip 02", "tip 03", "Tip 04", "Tip 05", ]; var i = 1; var pippo = $("#div"); setInterval(function() { pippo .fadeToggle() .html(array[i]);

嗨,我有这样一个代码,它以这种方式在预先终止的时间内循环:

var array = [
    "tip 01",
    "tip 02",
    "tip 03",
    "Tip 04",
    "Tip 05",
];
var i = 1;
var pippo = $("#div");

setInterval(function() {            
     pippo
        .fadeToggle()
        .html(array[i]);
        i++;
if (i == array.length){i=0;}

    }, 7000);
因此div的内容将是数组的一个单元格。正如您所看到的,div应用了一个fadeToggle效果,因此如果div可见,则会淡出,反之亦然

问题是动画无法正常工作

当动画开始时,它就像第一个被显示一样#div内容(没有动画)淡出淡入

我希望这部电影是淡入淡出的

我注意到的一点是,这就像循环在7秒内循环两次。 因为如果我写:

setInterval(function() {            
     pippo
        .fadeIn()
        .html(array[i])
        .fadeOut();
        i++;
if (i == array.length){i=0;}

    }, 7000);
淡入淡出淡入淡入淡出淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入淡入。当7秒过去时,再次出现

如何使此动画平滑?
提前感谢大家

如果可能,fadeToggle功能操作重叠,请尝试以下操作:

var array = [
    "tip 01",
    "tip 02",
    "tip 03",
    "Tip 04",
    "Tip 05",
];
var i = 1;
var pippo = $("#div");

function fader() {            
    pippo.fadeToggle(function(){
        i++;
        if (i == array.length){i=0;}
        setTimeout(fader, 7000) 
    }).html(array[i]);
}

如果可能,fadeToggle功能动作重叠,请尝试以下操作:

var array = [
    "tip 01",
    "tip 02",
    "tip 03",
    "Tip 04",
    "Tip 05",
];
var i = 1;
var pippo = $("#div");

function fader() {            
    pippo.fadeToggle(function(){
        i++;
        if (i == array.length){i=0;}
        setTimeout(fader, 7000) 
    }).html(array[i]);
}

如果您想淡出更改HTML淡出,您可以这样做

var array = [
"tip 01",
"tip 02",
"tip 03",
"Tip 04",
"Tip 05",
];
var i = 0;
var pippo = $("#div");
function f(){
    pippo.fadeOut(function(){
        pippo.html(array[i]).fadeIn(function(){
            i++;
            if (i == array.length){i=0;}
            setTimeout(f, 7000);
        });
    });
}
setTimeout(f, 7000);      

如果要淡出更改HTML fadeIn,可以这样做

var array = [
"tip 01",
"tip 02",
"tip 03",
"Tip 04",
"Tip 05",
];
var i = 0;
var pippo = $("#div");
function f(){
    pippo.fadeOut(function(){
        pippo.html(array[i]).fadeIn(function(){
            i++;
            if (i == array.length){i=0;}
            setTimeout(f, 7000);
        });
    });
}
setTimeout(f, 7000);      

创建一个JSFIDLE来帮助别人帮助你..抱歉@Nelson你是对的..创建一个JSFIDLE来帮助别人帮助你..抱歉@Nelson你是对的..非常感谢它就像一个符咒…但是你能给我解释一下代码吗?我可以用“慢”或“快”或毫秒来操纵fadeIn缓和和动画计时吗?是的,你可以在
pippo.fadeOut('slow',function
pippo.html(array[i])上添加慢、快或毫秒。fadeIn('fast',function()
非常感谢,它就像一个符咒……但你能解释一下代码吗?我能用“慢”或“快”或毫秒来操纵fadeIn的放松和动画计时吗?是的,你可以在
pippo.fadeOut('slow',function
pippo.html(array[i])上添加慢、快或毫秒。fadeIn('fast',function()