Javascript: Wie um zu überprüfen, ob element sichtbar ist?

bin ich mit dem leichten zepto.js Rahmen und jetzt brauche ich, um zu testen, ob ein element auf der Seite sichtbar ist, oder nicht ... das ist mein Fall:

Einer Taste löst die Funktion show_guides().

function show_guides() {
    $('#guides').toggle();

    if ( $('#guides').is(':visible') ) { //does not work
        //$.cookie('guides_visible', 'true');
        console.log("visible");
    } else {
        console.log("invisible");
        //$.cookie('guides_visible', null);
    }
}

Wenn die $('#guides') sichtbar sind, möchte ich ein cookie gespeichert und wenn Sie nicht ich will es loswerden.

Jedoch zepto.js keine Unterstützung für Selektoren wie :visible also muss ich einen anderen Weg finden.
Irgendwelche Ideen, wie das zu tun? Im Moment bin ich immer die folgende Fehlermeldung:

Nicht abgefangener Fehler: SYNTAX_ERR: DOM Exception 12

In der zepto-Dokumentation habe ich gelesen, das ...

Für die grundlegende Unterstützung von jQuery nicht-standard-pseudo-Selektoren wie
:sichtbar, enthalten die optionale "selector" - Modul.

Aber ich habe keine Ahnung, wie dieses.

Jemand aus der wer könnte mir helfen hier? Vielen Dank im Voraus.

  • "Aber ich habe keine Ahnung, wie dieses." Auf die gleiche Weise laden Sie eine beliebige andere JavaScript-Datei. Include diese Datei, nachdem Sie geladen zepto.
InformationsquelleAutor matt | 2012-07-09
  1. 3

    Können Sie die CSS-Anzeige-Eigenschaft:

     function show_guides() {

        $('#guides').toggle();

        if ( $('#guides').css('display') == 'block' ) { 
            console.log("visible");
        } else {
            console.log("invisible");
        }
    }
    • Dies funktioniert nicht, wenn ein Vorfahre versteckt ist. Zum Beispiel ein Bild im inneren eine versteckte div zurückkehren würde, 'block', auch wenn es nicht sichtbar ist, weil es die div-container ausgeblendet ist.
    InformationsquelleAutor sdespont
  2. 1

    versuchen 

         style.display="block";

    und

         style.display="hidden";
    InformationsquelleAutor Avinash
  3. 1

    Können Sie überprüfen visibility:visible/hidden oder display:block/none

    $('#guides').css('visibility') == 'visible'
$('#guides').css('display') == 'block'
    InformationsquelleAutor fedmich
  4. 1

    Wenn alle Sie wollen, ist zu überprüfen, Sichtbarkeit, können Sie einfach diese

      function visible(elem){
    elem = $(elem)
    return !!(elem.width() || elem.height()) && elem.css("display") !== "none"
  }

    gerade von der zepto-Selektoren im plugin. Ansonsten können Sie einfach schließen Sie die Selektoren-Modul von https://github.com/madrobby/zepto/blob/master/src/selector.js als Felix Kling vorgeschlagen

    InformationsquelleAutor Zaptree
Schreibe einen Kommentar