Slider auf Basis von CSS3 :target

Slider-auf-Basis-von-CSS3--target

Im World Wide Web begegnet man häufig Slidern, beispielsweise auf Referenzseiten. Dort kann man dann zwischen den einzelnen Referenzen mit Hilfe von Navigationspfeilen hin und her wechseln, wobei oft auch noch eine kleine Beschreibung eingeblendet wird. Wenn die CSS3 Klasse :target verwendet wird, ist das auch nur mit CSS3 möglich.

"Slider auf Basis von CSS3 :target" Weiterlesen

Feedburner stellt Code unformatiert dar

Als ich den RSS Feed meines Blogs eingerichtet habe, bin ich auf den Google Dienst Feedburner gestoßen, der mir sehr einfach und komfortabel in der Darstellung und sonstigen Handhabung des Feeds erschien. Doch leider ergab sich da ein kleines Problem in der Darstellung von Quellcode mit Hilfe des Plugins Crayon, der unformatiert in dem Feed von Feedburner angezeigt wurde.
Das lässt sich jedoch glücklicherweise leicht beheben. "Feedburner stellt Code unformatiert dar" Weiterlesen

Dropdown Menü im IE8 und älter

In älteren Internet Explorer Versionen gibt es diverse Probleme mit der Darstellung von Dropdown Menüs, die nur auf CSS basieren. Wenn das Menü mehr als zwei Unterebenen hat, werden diese dritten, vierten usw. Ebenen bis zum IE8 alle dargestellt, wenn man über einen Oberpunkt in der ersten Unterebene hovert. Das ist so natürlich nicht gewünscht und kann auf einigen Umwegen korrigiert werden.
Dafür benötigen wir zuerst in der HTML Datei zwischen den HEAD-Tags den Code für ein alternatives Stylesheet (conditional stylesheet), das für IE8 und älter gilt:

"Dropdown Menü im IE8 und älter" Weiterlesen

Dropdown Menü mit CSS3

dropdown-menue-mit-css3

Häufig werden Dropdown Menüs mit Javascript umgesetzt, um eine Animation zu ermöglichen. Doch mittlerweile geht dies auch gut alleine mit CSS3. Hier zeige ich Ihnen, wie ein Dropdown Menü zu realisieren ist, dass sich mit einer auf CSS3 basierenden Animation ausklappt.
Zuerst schreiben wir eine einfache verschachtelte Liste in HTML, die wir für die horizontale und vertikale Variante verwenden können:

"Dropdown Menü mit CSS3" Weiterlesen

Tooltips mit CSS3 umsetzen

css3-tooltip

Tooltips sind nützliche kleine Erklärungen zu eventuell unbekannten Begriffen oder Ähnlichem. Tooltips haben gegenüber dem title-Tag den Vorteil, dass sie individuell an das Design der Seite angepasst werden können.
Um einen Tooltip zu erstellen, gehen wir ähnlich vor wie bei einem Dropdown Menü, das mit CSS umgesetzt wurde.

"Tooltips mit CSS3 umsetzen" Weiterlesen