WebTec - Blog

 

CSS background kreativ und spannend einsetzen

1
2
3
4
5
6
7
8
9
10
11
12
13
4
15
16
17
18
19
20
21
22
23
24
25

Vor CSS3 gab es nur wenig Möglichkeiten mit der Eigenschaft "background" wirklich spannende Effekte zu erzielen. Pro HTML Element konnte nur eine Farbe oder ein Bild zugewiesen werden.
Mit background-repeat kann bei diesem einen Bild das Wiederholen gesteuert werden (gar nicht - nur horizontal - nur vertikal - in beide Richtungen. Das background-attachment kann man ein fixiertes Hintergrundbild (fixed) erzwingen und die background-position platziert es im Element.

Alle modernen Browser unterstützen mittlerweile die neuen CSS3 background Attribute, die dem Frontend Entwickler viel kreativen Spielraum bringen!

 

Browser Typ und Version erkennen

logo-mixDer Frontend Entwickler steht manchmal vor Anforderungen, die es nötig machen genau festzustellen welcher Browser und welche Browserversion seine Webseite anzeigt. Vor JQuery 1.9 stand dafür die Funktion .browser zur Verfügung, die aktuell nur durch das Plugin Migrate wieder aufrufbar ist. 

Welche HTML5 und CSS3 Features der Browser verarbeiten kann, überprüft der Modernizr. Er fügt dem BODY entsprechende Klassen hinzu mit denen der Frontend Entwickler auf veraltete Browser und den IE reagieren kann.

Was aber tun , wenn z.B. für den IE8 bestimmte Funktionen oder Inhalte komplett getauscht werden müssen?

 

Flexible Divs mit festem Seitenverhältnis

1

Hier kommt Text!

3

4

5

6

und weiter text bin text bin text....

8

9

Die Größe von Divs wird für responsive Webseiten besser relativ zum Elternelement angegeben. Möchte man nun aber unabhängig vom Inhalt einen bestimmten Look erzeugen, z.B. quadratische Kacheln wie Win8, kann diese reine CSS Lösung helfen!

Ergebnis ist, dass eine beliebige Anzahl von Kacheln in beliebiger Spaltenanzahl unabhängig vom Inhalt die gleiche Fläche bekommen und wir das Seitenverhältnis der Kacheln festlegen können.

 

Joomla Template migrieren 1.5 nach 3.x

joomla 3 filestructureMit Migrationskomponenten wie JUpgrade oder SP-Upgrade lassen sich zwar die Inhalte, Struktur und teils auch fremde Erweiterungen in eine aktuelle 3.x Version migrieren. Doch das vorhandene 1.5 Template kann von diesen Komponenten in den meisten Fällen nicht angepaßt werden.

Besonders wenn das Quell Template zahlreiche html overrides enthält, direkt mit der Joomla API arbeitet oder ein Framework verwendet ( z.B. Gantry, Warp, Gavern, Zen Grid, Helix, ...) kann es unverhältnismäßig aufwendig sein, dass Template selbst zu ändern. 
Prüfen Sie daher immer, ob es vom Anbieter eine aktuelle Version ihres Templates gibt!

Einfache Templates die sich auf das Positionieren des Joomla Outputs und Layout Styles beschränken, können dagegen mit folgender Methode für Joomla 3.x nutzbar gemacht werden:

FacebookTwitterDiggGoogle BookmarksTechnoratiLinkedin