Cómo probar si DIV está abierto o cerrado después de slideToggle

Tengo un botón Jquery Ui (#toggleIcons) que, cuando se hace clic, alterna un div (.icons) para mostrar algunos íconos. También estoy usando Jquery Isotope e Infinitescroll para agregar nuevas imágenes dinámicamente. Lo que estoy tratando de hacer es tener una forma de mantener el estado slideToggle a medida que se agregan y actualizan las nuevas imágenes. Ifinitescroll tiene una función de devolución de llamada para que pueda actualizar la página y el estado de los íconos.

//My button click function
$("#styleSwitcher #toggleIcons" ).click(function() {
   $('.icons').slideToggle('slow');
   //for Isotope to update the layout
   $('#container').isotope('reLayout') 
    return false;
});

//code I am working on to put in callback to test if div is open or closed
if($(".icons").is(":hidden"))
{
  $('.icons').hide();
}
else
{
  $('.icons').show();
}

No funciona. Cualquier ayuda o dirección sería apreciada. gracias

Tienes tu condición al revés:

if ($(".icons").is(":visible")) { <-----
  $('.icons').hide(); 
} else {
  $('.icons').show(); 
}

Ponga el script de estado de verificación en una función, déjelo esperar un poco.

$('.advance-view').click(function() {
    $('#advance-control').slideToggle('slow', function() {
        if ($('#advance-control').is(':hidden'))
        {
            $('.advance-view').css("background-color", "#2B509A");
        }
        else
        {
            $('.advance-view').css("background-color", "#4D6837");
        }
    });             
});

yo usaría :visible

if($(".icons:visible").length > 0)
    //item is visible
else
    //item is not visible

pero si quieres apegarte a tu código

if($(".icons").is(":hidden"))

probablemente debería leer

if($(".icons").is(":hidden").length > 0)

estaba haciendo lo mismo pero para una configuración basada en id y luego descubrí que funcionaba cuando usé esto en su lugar

if ($(this).is(':hidden')) {
    var state = "closed";
} else {
    var state = "open";
}

alert($(this).attr('id') + ' is ' + state);
return false;           

porque no solo palanca o deslizar Alternar ¿él?

$(".icons").toggle();

Creo que entiendo lo que quieres. desde algún botón, que no tiene nada que ver con añadir imágenes, los usuarios pueden ocultar y mostrar iconos. Se agregan nuevas imágenes, con íconos ‘mostrando’, y no tiene idea en la devolución de llamada si debe mostrar los íconos u ocultarlos para que coincidan con el resto de la galería.

//My button click function
$("#styleSwitcher #toggleIcons" ).click(function() {
$('.icons').slideToggle('slow');
//for Isotope to update the layout
$('#container').isotope('reLayout').data({iconStateIsHidden:$('.icons').is(":hidden")}); 
 return false;
 });



 //code I am working on to put in callback to test if div is open or closed



       if($("#container").data()[iconStateIsHidden])
          {
// newly added images should match the rest of the gallery
        $('.icons').hide(); 
          }     
        else
          {
// newly added images should match the rest of the gallery
        $('.icons').show(); 
          } 

Utiliza otro método que es más robusto y más corto. Puede agregar un atributo, por ejemplo, ‘abierto’ al elemento. La primera vez que lo lee no está allí, por lo que asume que es la posición inicial. Si es ‘0’, lo invierte y en el bloque de condiciones hace slidedown() o slideup()

Esto tiene muchos beneficios: – puede leer el valor mediante el depurador del navegador y verlo cambiado – lo más útil es que puede leer ese valor usando .each iterator y verificar los que están abiertos

function toggleBox(id) {
    let o = $("#box_" + id);    
    let op = o.attr("open") !== undefined;  
    if (op) {
        o.slideUp();
        o.removeAttr("open");       
    } else {
        o.slideDown();
        o.attr("open","1");     
    }   
}