wake-up-neo.com

So testen Sie, ob DIV nach dem SlideToggle geöffnet oder geschlossen ist

Ich habe eine Jquery Ui-Schaltfläche (#toggleIcons), die beim Klicken ein div (.icons) umschaltet, um einige Symbole anzuzeigen. Ich benutze auch Jquery Isotope und Infinitescroll, um neue Bilder dynamisch hinzuzufügen. Was ich versuche zu tun, ist eine Möglichkeit, den Zustand SlideToggle beizubehalten, wenn die neuen Bilder hinzugefügt und aktualisiert werden. Ifinitescroll hat eine Rückruffunktion, damit ich die Seite und den Status der Icons aktualisieren kann.

//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();
}

Funktioniert nicht. Jede Hilfe oder Anleitung wäre dankbar. Vielen Dank

14
Macsupport

Sie haben Ihren Zustand rückwärts:

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

Setzen Sie das Check State Script in eine Funktion - lassen Sie es ein wenig ...

$('.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");
        }
    });             
});
20
Ryan Harne

warum nicht einfach toggle oder slideToggle it?

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

Ich würde :visible verwenden

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

aber wenn Sie sich an Ihren Code halten wollen

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

sollte wahrscheinlich lesen

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

ich tat das Gleiche, aber für ein ID-basiertes Setup, und dann fand ich, dass es funktionierte, wenn ich es stattdessen verwendete 

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

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

ich glaube, ich verstehe, was du willst. Von einer Schaltfläche, die nichts mit dem Hinzufügen von Bildern zu tun hat, können Benutzer Symbole ein- und ausblenden. Neue Bilder werden hinzugefügt, mit Symbolen "angezeigt", und Sie haben keine Rückrufaktion, ob Sie die Symbole anzeigen oder ausblenden sollten, damit sie mit dem Rest der Galerie übereinstimmen.

//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(); 
          } 
0
DefyGravity