“Spazierender” – bewegter Link

Mit einem sogenanntem „spazierendem“ Link ist ein Link mit gepunktetem Unterstrich gemeint beim dem sich die Punkte bewegen sobald man mit der Maus über ihn fährt. Dazu wird in den Anker-Pseudo-Klassen a:active (Links, die gerade gedrückt sind) und a:hover (Maus befindet sich auf dem Link wurde aber noch nicht geklickt) die ursprüngliche Hintergrundgrafik durch eine animierte ersetzt, eine sogenannte GIF Datei. Dadurch entsteht dann beim darüberfahren der Eindruck als würden die Punkte spazieren. In der CSS Datei sieht das Ganze dann beispielhaft so aus:

a, a:visited {
   background: url(images/dot.gif) repeat-x center bottom;
   text-decoration: none;
   padding-bottom: 2px;
   color: #900;
   }
   a:hover, a:active {
      background: url(images/dotwalk.gif) repeat-x center bottom;
   }

Ein Beispiel wie ein solcher Link aussieht kann man im CSS Zen Garden sehen. Einfach mit der Maus über einen Link fahren und der Effekt wird sichtbar.

  1. Bisher keine Kommentare
  1. Bisher keine Trackbacks