diferido addclass/remove clase función no funciona

¿qué estoy haciendo wroing aquí?diferido addclass/remove clase función no funciona

$(function() { 
$('ul li:nth-child(1)').addClass("go").delay(4500).removeClass("go"); 
$('ul li:nth-child(2)').addClass("go").delay(1500).removeClass("go"); 
$('ul li:nth-child(3)').addClass("go").delay(500).removeClass("go"); 
$('ul li:nth-child(4)').addClass("go").delay(4500).removeClass("go"); 
$('ul li:nth-child(5)').addClass("go").delay(1000).removeClass("go"); 
});

Fuente

2011-02-10 Bizarro Zeldman

pequeña explicación sería práctico. Supongo que está intentando cambiar la clase de una lista en un orden específico configurándola después de un retraso diferente para cada elemento. ¿Qué bit no funciona? – Spacedman

.delay() solo retrasa las animaciones, no las funciones –

.delay() está diseñado solo para trabajar con animaciones. Vas a tener que recurrir al uso de setTimeouts regulares de lo que está haciendo:

var li = $('ul li:nth-child(1)').addClass('go'); 
setTimeout(function() { 
    li.removeClass('go'); 
}, 4500);

Para que haciendo esto para cada <li> un poco más agradable, se puede refactorizar el código de este modo:

$(function() { 
    var delays = [4500, 1500, 500, 4500, 1000]; 
    $('ul li').addClass('go').each(function (i) { 
     setTimeout(function (li) { 
      li.removeClass('go'); 
     }, delays[i], $(this)); 
    }); 
});

Fuente

2011-02-10 08:28:30

Estoy creando una animación en la que tendré una gran cantidad de elementos de la lista: ninguno; Luego, necesito agregar una clase a cada elemento de la lista, de uno en uno, por un período de tiempo predeterminado; solo después de que haya transcurrido el tiempo, se elimina la clase y se agrega al siguiente elemento de la lista. En ese momento, se agregará la misma clase al siguiente elemento de la lista por una cantidad completamente diferente de tiempo predeterminado. para un s –

@Bizarro, está trabajando aquí: http://jsfiddle.net/eXJQB/. –

thx, funciona un poco ... si miras, ves que todas las clases se aplican en el mismo instante (todas se vuelven azules al mismo tiempo) y luego se desvanecen en diferentes intervalos. Necesito que la clase se aplique a un solo elemento de la lista, una vez que el tiempo haya pasado, ENTONCES se aplica al siguiente elemento de la lista –

Sólo para añadir, se puede utilizar un .queue:

$('ul li:nth-child(1)').addClass("go") 
         .delay(4500) 
         .queue(function() { 
          $(this).removeClass("go"); 
          $(this).dequeue(); 
         });

Fuente

2011-02-10 08:32:25 karim79

Ah, me olvidé de esto +1. ¡No te olvides de '.dequeue()' o 'next()'! –

@ Box9 - Buen punto. He lanzado '.dequeue()'. – karim79

Sigue siendo el mismo problema: las clases se agregan a los elementos de la lista al mismo tiempo ... luego se eliminan en diferentes momentos. Compruebe: http://jsfiddle.net/bM6uY/8/ –

diferido addclass/remove clase función no funciona

Respuesta

Cuestiones relacionadas