Jquery: Objekte vor dem Laden verstecken

[Patrick]

Hallo,

ich mach grad ne Gallerie mit Plakaten. Ich leg nun mit Divs alle Plakate übereinander. Alle ausser das erste sollen natürlich zu beginn unsichtbar sein. Und dann je nachdem welches man ansehen will und auf den entsprechenden Link klickt, soll das aktuelle Plakat ausgeblendet werden und das neue eingeblendet werden. Das mit dem ein und ausblende funktioniert auch. Aber ich krieg die Plakate am Anfang nicht versteckt.Ich will das mit der document ready function machen. Was mach ich falsch?

$(document).onLoad(function(){

$("#plakat\_2").hide();  
$("#plakat\_3").hide();  
$("#plakat\_4").hide();  

});

var aktuell = 1;

function bildLaden(nr){

$("#plakat\_" + aktuell).animate({opacity: 'hide'},'slow');  
$("#plakat\_" + nr).animate({opacity: 'show'},'slow');  
aktuell = nr;  

};

[molily]

Ich will das mit der document ready function machen. Was mach ich falsch?

$(document).onLoad(function(){

Ddiese Methode gibt es nicht und dürfte dir einen Fehler in der JavaScript-Fehlerkonsole des Browsers anzeigen.

Wenn du document ready verwenden willst, so musst du $(document).ready() verwenden.

Aber einfacher ginge es, indem du die Versteck-Regeln im Stylesheet setzt und im JavaScript nur dafür sorgst, dass sie angewendet werden.

Im Stylesheet:

.jsactive #plakat_2, .jsactive #plakat_3, .jsactive #plakat_4 {
   display: none;
   /* Hier könntest du alternativ barrierefrei verstecken */
}

Im JavaScript:

$(html).addClass('jsactive');

Mathias

[Patrick]

achso ich hab da was falsches reingepackt oben. Da müsste eigentlich stehen

$(document).ready(function(){

und dann weiter...

aber dann werden die Objekte auch nicht versteckt. Irgendwie gibt es ein Problem mit der document ready funktion, denn wenn ich ein Alert reinmache, dann wird das auch nicht ausgegeben. D.h. die ready funktion wird nicht aufgerufen. Funktioniert das Lokal nicht?

[Gunther]

Hallo Patrick!

Irgendwie gibt es ein Problem mit der document ready funktion, denn wenn ich ein Alert reinmache, dann wird das auch nicht ausgegeben. D.h. die ready funktion wird nicht aufgerufen.

Also hast du vermutlich mind. einen Fehler in deinem Quellcode.
Wenn du diesen hier nicht presentierst, kann man dazu aber weiter nichts sagen.

Funktioniert das Lokal nicht?

Da Javascript clientseitig ausgeführt wird, hat das nichts damit zu tun.
BTW: JS im Browser aktiviert?

Gruß Gunther

[Cybaer]

Hi,

Aber einfacher ginge es, indem du die Versteck-Regeln im Stylesheet setzt und im JavaScript nur dafür sorgst, dass sie angewendet werden.

Wobei man so natürlich dennoch die Objekte erst nach dem Laden verstecken kann, und nicht bereits vorher.

Wenn man wirklich vor dem Laden verstecken will/muß, dann kann man am einfachsten gerade mit JS ein kleines, passendes Stylesheet im HEAD ausgeben ...

... oder natürlich das bestehende Stylesheet ändern. ;->

Gruß, Cybaer

[molily]

Wobei man so natürlich dennoch die Objekte erst nach dem Laden verstecken kann, und nicht bereits vorher.

Wieso?
Stylesheet und Scripte müssen geladen sein, aber nicht das Dokument.
Da externe Stylesheets und Scripte im HEAD das Parsing verzögern, ist das auch gegeben.

Wenn man wirklich vor dem Laden verstecken will/muß, dann kann man am einfachsten gerade mit JS ein kleines, passendes Stylesheet im HEAD ausgeben ...

Das wird doch durch Setzen der Klasse unnötig; sie sorgt dafür, dass die besagten Stylesheet-Regeln greifen, bevor überhaupt der body geparst und dargestellt wird.

Mathias

[Gunnar Bittersmann]

@@molily:

nuqneH

Das wird doch durch Setzen der Klasse unnötig

Erzähl doch Cybaer nichts vom Pferd! Ein Pferd namens Nachfahrenselektor ;-)

Qapla'

[Cybaer]

Hi,

Erzähl doch Cybaer nichts vom Pferd! Ein Pferd namens Nachfahrenselektor ;-)

Man hat schon Pferde vor der Apotheke kotzen sehen! ;->

Gruß, Cybaer

[ChrisB]

Hi,

Erzähl doch Cybaer nichts vom Pferd! Ein Pferd namens Nachfahrenselektor ;-)

Man hat schon Pferde vor der Apotheke kotzen sehen! ;->

Waren sie angewidert, als du mal wieder vollkommen unnötigerweise deine Stylesheets-manipulieren-Spatzenkanone aufgefahren hast ...?

SCNR ChrisB

[Cybaer]

Hi,

Waren sie angewidert, als du mal wieder vollkommen unnötigerweise deine Stylesheets-manipulieren-Spatzenkanone aufgefahren hast ...?

Nein, sie haben natürlich freudig mit den Hufen gescharrt! ;-)

Zumindest was Mr. Ed angeht ... ;)

Gruß, Cybaer

[Cybaer]

Hi,

Das wird doch durch Setzen der Klasse unnötig; sie sorgt dafür, dass die besagten Stylesheet-Regeln greifen, bevor überhaupt der body geparst und dargestellt wird.

Ach so, ich hatte, mangels jQuery-Kenntnis den Aufruf wohl falsch verstanden. Du weist dem HTML-Element die Klasse "jsactive" zu? Ich dachte, dem Element würde die Klasse zugewiesen ...

Und wie ich das sehe, ist mit HTML 5 ja auch die Beschränkung verschwunden, daß das HTML-Element kein CLASS-Attribut haben darf, womit man sich wohl zukünftig auch keine Inkompatiblität mehr einhandeln wird ...

Gruß, Cybaer

[molily]

Ach so, ich hatte, mangels jQuery-Kenntnis den Aufruf wohl falsch verstanden.

Was vermutlich daran lag, dass er falsch war. ;)

$(html).addClass('jsactive');
sollte natürlich
$('html').addClass('jsactive');
lauten

Du weist dem HTML-Element die Klasse "jsactive" zu?

Ja, man könnte auch einfach performanter document.documentElement.className nutzen, wenn man dicke Scripte wie jQuery am Dokumentende einbettet.

Mathias

[Cybaer]

Hi,

Ja, man könnte auch einfach performanter document.documentElement.className nutzen, wenn man dicke Scripte wie jQuery am Dokumentende einbettet.

*Das* hätte sogar *ich* verstanden! ;-)

Gruß, Cybaer