13
Feb
Whitespaces zwischen horizontalen li-Elementen
Für viele Layouts und Designs braucht man horizontal angeordnete Listen. Beispielsweise wenn man einen schicken Header designen will.
Das Problem dabei ist, dass Browser zwischen den li-Elementen (ListItems) meistens Whitespaces einfügen. Am Ende kann dies das geplante Layout einer Website total zerschießen. Aber woran liegt das? Machen das die Browser mit Absicht?
(more…)
by IgelHaut | Kommentare deaktiviert
1
Feb
Asynchroner JavaScript Script-/ Stylesheet-/ Bild-Loader
Es ist schon eine ganze weile her, als ich das letze mal was in meinem Blog veröffentlich habe… Jetzt habe ich aber wieder zeit ein bisschen was zu veröffentlichen.

Heute habe ich mir mal vorgenommen einen asynchronen Resource-Loader für meine Webapps zu schreiben. Natürlich gibt es im Netz für alles mögliche die verschiedensten Scripts, aber bekannterweise tun die meisten nicht das was sie sollen, sind viel zu komplex oder sind einfach mit Funktionen überfüllt die man nicht braucht.
Meine Grundidee dabei war es einen schicken Preloader, der mir alle meine Stylesheets, Scripts und Bilder für meine App vorlädt, zu basteln.

Gesagt – getan, als erstes habe ich mir eine kleine Javascript-Klasse geschrieben, die sich automatisch bei der Scriptausführung in den globalen Variablenbereich der Website initialisiert.
Um die Dateien nun zu laden muss man einfach nur rscLoader.load('*Link-Zur-Datei*', '*Typ*'); in den HTML-Body schreiben; die dateien werden automatisch und asynchron geladen, ohne die Website anzuhalten.
Natürlich habe ich auch Events eingebaut, mit denen man automatisch den Status der geladenen Dateien abrufen kann. Diese habe ich als sogenannte listener implementiert: rscLoader.listen('*Typ*', function(stats, resources) { // Tu alles was du willst }); In denn Callbacks dieser Events ist es möglich, den aktuellen Status der Datein des übergebenen Typs zu überprüfen und gegebenenfalls eine Aktion durchzuführen.

Quelltext ist auf Github verfügbar: rscLoader 0.01.06
by IgelHaut | Kommentare deaktiviert
IgelHauts Blog