jQuery: Inhalt verstecken bis fertig geladen
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anfang
aufruf
benutzer
beobachten
beseitigen
code
display
dom
effekt
element
ersten aufruf
legen
live demo
nutzer
schlaue idee
spielerei
url
verschiedenen elemente
verschwinden
verstecken
-
Heyhou zusammen
Ich bin gerade dabei, mein bestehender Internetauftritt mit ein paar Animationen zu verschönern.
So soll beim ersten Aufruf die verschiedenen Elemente wie Titel, Navigation und Content eingeblendet werden. Dies klappt auch wunderbar :)
Leider aber werden die Elemente zuerst aufgebaut, was für den Benutzer sichtbar ist, und diese verschwinden dann - dies sieht äussert hässlich aus und möchte ich gerne beseitigen.
Live-Demo
Es handelt sich um folgende Seite (Beim ersten Aufruf ist der Effekt am besten zu beobachten, da noch nichts im Cache vorliegt und er länger braucht für den Seitenaufbau)
http://globals.ch/?beta
So funktionierts bisher:
1) jQuery positioniert die verschiedenen Elemente um bzw. versteckt Sie (auch wenn das DOM noch nicht fertig aufgebaut ist, da nicht im ready()
2)Sobald die Seite fertig aufgebaut ist, werden die Elemente eingeblendet bzw. eingefahren (befindet sich im ready()
Nicht funktionierende Lösungsansätze
Was mir sehr wichtig ist, ist dass die Seite auch ohne aktiviertes Javascript komplett funktioniert. So kann ich die Elemente nicht per CSS von Anfang an verstecken und diese dann per jQuery einblenden - dann wäre die Seite für die Benutzer ja leer...
Auch nichts gebracht hat das verschieben des "verstecken"-Codes, zB direkt ins jQuery.js o.ä.
Ein Layer mit dem BG-Bild über alles zu setzen geht ebenfalls nicht (Javascript-abhängig...)
Ich hoffe, jemand hat eine schlaue Idee, wie ich diesen hässlichen Effekt verhindern kann :-)
Bin langsam mit den Nerven am Ende
Danke & Gruss
Sublime -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
CSS:
#div { display: none; }
Und mit noscript das Ganze doch anzeigen lassen.
Beitrag zuletzt geändert: 17.8.2011 17:19:10 von fabo -
Es ist durchaus sinnvoll, wenn Elemente erst durch jquery ausgeblendet werden! Elemente, die Du per CSS von vorn herein ausblendest und erst per JS sichtbar machst, sind für Nutzer ohne Javascript dauerhaft nicht sicht- und nutzbar.
Du könntest deine Jquery-Aufrufe aber an den Anfang deines Codes legen, so daß die Elemente nicht erst ausgeblendet werden, wenn der Seitenaufbau vollständig ist.
Unabhängig davon, halte ich diesen Effekt eh für eine überflüssige Spielerei. ;)
FF -
Hallo zusammen
Herzlichen Dank für die Antworten.
Die Lösung von Fabo ist genau die Gedankenstütze, die mir gefehlt hat :-) So kann ich die Element einblenden lassen, wenn kein Javascript vorhanden ist. Dies funktioniert einwandfrei (siehe Seite)!
Du könntest deine Jquery-Aufrufe aber an den Anfang deines Codes legen, so daß die Elemente nicht erst ausgeblendet werden, wenn der Seitenaufbau vollständig ist.
Hat eben nicht gereicht, da manche Browser die verschiedenen Elemente nicht parallel abarbeiten, oder aber das HTML/CSS-Konstrukt zu schnell aufbauen, so dass es kurz angezeigt wird.
Unabhängig davon, halte ich diesen Effekt eh für eine überflüssige Spielerei. ;)
Da muss ich schon ein bisschen zustimmen - Aber ein kleiner "WOW"-Effekt darf da schon sein - Ist der PC zu lahm dafür merkens die Benutzer eh kaum..
Der Theard kann hiermit geschlossen werden :-)
Gruss Sublime -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage