Volviendo de nuevo a las animaciones jquery css estados originales

Question

que tengo una página de elementos, cada uno de los cuales, dependiendo de la interacción del usuario, pueden ser animados de distancia en la función dada:

function slideAndFade(id){ 
    $(id).animate({opacity: 'toggle', width: 'toggle'}, 500); 
} 

Quiero crear una función de reinicio que trae todos los elementos a la página. La ejecución de todos los elementos mediante la función de alternar anterior no funcionará, ya que se mostrarán los elementos actualmente ocultos, y los elementos mostrados actualmente se ocultarán.

Esencialmente, buscamos la forma de revertir todos los elementos a sus estados css originales, independientemente de si la animación jquery los ha afectado.

de Acción de Gracias

Editar:

di cuenta de todo lo que necesita hacer es reemplazar 'alternar' con 'show':

function revertSlideAndFade(id){ 
    $(id).animate({opacity: 'show', width: 'show'}, 500); 
} 

Al llamar a este en cualquier elemento asegurará la el elemento se revierte a visible en este caso. Sin embargo, ver Nick's answer a continuación para un enfoque más general aplicable.

Answer 1

Si se pudiera identificar todos los elementos que podrían ser pasados ​​a esta función, decir que tenían una clase .toggleElem usted podría utilizar eso para almacenar los valores de carga de la página y restaurar a continuación, cuando sea necesario, de esta manera:

$(function() { 
    $(".toggleElem").each(function() { 
    var $this = $(this); 
    $.data(this, 'css', { opacity: $this.css('opacity'), 
          width: $this.css('width') }); 
    }); 
}); 

Luego puede restaurarlos en cualquier momento posterior:

function restore() { 
    $(".toggleElem").each(function() { 
    var orig = $.data(this, 'css'); 
    $(this).animate({opacity: orig.opacity, width: orig.width}, 500); 
    }); 
}