jQuery - Beste Weg, um zu verbergen element? ( um zu verhindern, dass das element, aus blinken, bevor Sie tatsächlich es zu verbergen )

Ich erinnere mich, dass irgendwann die Oper ( Mostlikely it was Safari instead. ) hatte ein problem, dass, wenn Sie verwendet werden .hide() auf element, Sie würde kurz aufleuchten, bevor es tatsächlich ausblenden element.

Nun, wenn Sie nicht möchten, ignorieren Sie diejenigen, die aus irgendeinem Grund nicht haben js in Ihrem browser Sie nicht wirklich verwenden Sie CSS, um display: none; in das element zu verstecken, und verwenden Sie dann js, um zum Beispiel fade-in.

Ich habe vor kurzem bemerkt, dass dies nicht mehr passieren in der Oper. Also, ich würde gerne wissen, ob das immer noch passiert in manchen Browsern incase ive verpasst.. Und asuming, dass das passieren würde. Welche Weise wäre der sicherste Weg, es zu tun? ( natürlich ignoriert die css-Methode in diesem Fall. )

js .hide()

js .addClass('hide') css .hide { display: none; }

Oder etwas anderes?

Edit:

js element.style.display = "none"

js $(element).css({display:"none"})

Edit2: Das Problem wurde möglicherweise in Safari tatsächlich. Ich habe auch denken, dass die neueren jquery-Versionen haben könnte das Problem.. Als ich glaube, es gab ein paar bug-reports zu diesem problem auf der jquery-website, aber ich konnte nicht finden die bug-reports ..Oder könnte es immer noch sein, dass neuere browser-version behoben.. Nicht sicher.

Edit3:

So, ich habe in der Tat finden eine Menge mehr über diese, als ich anfing, auf der Suche nach diesem bug in Safari eher als Oper. Obwohl ich kann nicht sagen, für sicher, dass es nie passiert, in der Oper sowie...

Es würde scheinen, dass dieses problem nicht mehr vorhanden sind und, dass es sicher ist zu verwenden .hide() aber was ich gelernt habe, war, dass dieser $(element).css({display:"none"}) hast, das problem zu beheben, wenn das problem war immer noch da draußen.

element.style.display = "none" oder $(element).css({display:"none"}) sind Optionen auch.
Guter Punkt (+1)
Diesem Artikel kann nützlich sein für Sie als auch für die Entscheidung, welche ist schneller, aber anders als, dass ich eigentlich keine Ahnung habe
Lesen Sie diese Frage ALSO: stackoverflow.com/questions/5700865/...
Wollen Sie es aus der Strömung, wenn es versteckt oder einfach unsichtbar? Ich bevorzuge visibility: hidden beim laden, da bleibt das element in der content-flow und sonst nichts bewegt.
Macht nicht wirklich einen Unterschied machen @Sparky672 ich meine.. das tut wirklich Einfluss auf das blinken oder die Last der Zeit.. ich glaube so. So oder so, wenn seine display: none Sie können immer Handwerk, es zu schauen, wie visibility: hidden wenn es so wichtig.
Kein Unterschied zum laden aber mal Flashen, vielleicht. Nachdem alle, mit visibility:hidden das Objekt ist bereits in die Inhalte fließen und es muss nur gezeigt werden, jedoch mit display:none alle Inhalte müssen schieben um Platz zu machen, als Sie zu verbergen/zeigen das Objekt... sicherlich beiträgt, um den blinkenden Effekt. Und was ist der Vorteil der gehen durch den Aufwand der Herstellung display:none zu schauen, wie visibility:hidden wenn Sie nur könnten verwenden, die Sie wollen in Erster Linie?
Das problem war, dass der Inhalt wurde versteckt mit .hide() haben Last bis in die Seite wie jede deutlich sichtbare element, bevor es in der Lage war, tatsächlich verbergen element. Es war nur ein laden oder aktualisieren Problem zumindest aus meiner Sicht. Für mich hat das nichts damit zu tun, wie die Versteck-und oder zeigen wird, betreffen die Elemente um ihn herum. Mein Punkt über den display: none; - element Verhalten sich wie visibility: hidden; element war, dass, wenn.. sagen .hide() ist der beste Weg, dies zu tun, dann soll es so sein.. da Sie nicht wirklich Steuern, wie .hide() verbirgt.
Ich bin nicht wirklich zu einem Sponsoring hier, das ist der Grund, warum ich nicht posten eine Antwort. Lediglich darauf hingewiesen, dass es andere Wege gibt, um dies zu tun, jedes mit pros & cons.
Ich habe festgestellt, dass Sie mehr sind wahrscheinlich, um ein element zu blinken sichtbar, bevor es wieder ausgeblendet wird, wenn es in das domready-block. Einnahme aus dem domready und in den Fluss vor dem domready gut funktionieren kann, aber ich weiß nicht, ob es die beste Praxis, die so oder so nicht.

InformationsquelleAutor Joonas | 2011-08-21

5

Sollten Sie immer darauf angewiesen jQuery hide() Methode zum ausblenden von element, weil es kümmert sich um alle Browser. Ich habe nicht gesehen, Probleme in Opera obwohl.

Selbst zu zeigen, jedes element, das Sie sollten immer darauf angewiesen show() Methode wieder aus dem gleichen Grund.

E. g. Um zu zeigen, eine tr element ist, wenn wir sagen tr.css("display", "block") es funktioniert nicht in Firefox, weil es eine Zeile in der Tabelle und es muss angegeben werden, wie .css("display", "table-row"). Aber wenn Sie tr.show() Sie sich keine sorgen über irgendwelche browser.
- Gut, nicht ganz richtig, denn du kannst nur tun .css('display','none'); zu verbergen, und .css('display', ''); zu zeigen.
- das kann funktionieren, in dieser situation aber die Einstellung .css('foo','') ist nicht ganz sicher in allen Browsern. Ich habe tatsächlich gesendet, ein ticket für den Prototyp ein paar Jahre zurück, denn in der IE-Einstellung opacity zu '' standardmäßig auf 0. In einigen Browsern, Einstellung leer ist nicht das gleiche wie nie einstellen. (N. B. ich aufgehört, Prototyp, wenn gesagt ticket war geschlossen als "erwartetes Verhalten", weil Prototyp setzen Sie die Deckkraft auf ", die standardmäßig auf 0, DH, wenn Sie übergeben Sie 1, um die Funktion).
- Kannst du den Grund?
InformationsquelleAutor ShankarSangoli

Könntest du noscript verwenden, um eine alternative element, das wird immer angezeigt, während das JS-element beginnt versteckt.

Oder verwenden Sie eine Klasse mit keine CSS-Regeln, und dann bekommen Sie ein Skript zum ändern der CSS-Klasse der Regel, um sicherzustellen, das element beginnt versteckt.

<html>
    <head>
        <style type="text/css">
            p.start-hidden-if-js-enabled {              
            }
        </style>
        <script type="text/javascript">
            document.styleSheets[0].cssRules[0].style.display = "none";
        </script>
    </head>
    <body>
        <p class="start-hidden-if-js-enabled">
            This text will be hidden if javascript is enabled.
        </p>
    </body>
</html>

InformationsquelleAutor Dunes

0

Fügen Sie einfach ein display:none im stylesheet oder einen inline-style="display:none" auf das element.
- Ich erwähnte, dass in meiner Frage. Punkt der Frage ist zu zeigen, das element, wenn javascript deaktiviert ist und dadurch nicht ganz fit drin.
InformationsquelleAutor Nerudo

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.