Archiv der Kategorie: Tutorial

z-index CSS-Fix für Safari

Beim Betrachten meiner Seite auf einem iOS-Gerät ist mir aufgefallen, daß der Safari einige Probleme mit der Interpretation von der CSS-Eigenschaft z-index hat. Das Visual, sollte eigentlich im Hintergrund bleiben und der Contentbereich sollte sich beim Scrollen über das Visual schieben. Leider blieb das Visual für einen Moment im Vordergrund, um nach dem Scrollen im Hintergrund zu verschwinden. Im Internet hatte ich mehrere Lösungen gefunden, das Problem via jQuery zu beheben. Da ich aber auf meinem Blog lediglich drei Ebenen verwende wollte ich es unbedingt via CSS lösen. Gestern Abend bin ich dann auf die Lösung gekommen.

Ein vereinfachtes Beispiel: So sieht es aus!

Im Groben ist die Seite wie folgt aufgebaut:

<div class="topline"></div>
<div class="visual"></div>
<div class="content">
   <div class="innercontent"></div>
</div>

Weiterlesen

Retina fürs Display

Der Effekt von Grafiken auf Retina-Displays oder anderen hochaufgelösten Displays hat mich so sehr fasziniert, daß ich diesen Effekt auch haben wollte. Gesagt getan, das Logo von Projectdream gibt es jetzt in zwei Versionen.

Retina und Fallback

Retina und Fallback

Für Retina-Displays gibt es nun eine doppelt so hoch aufgelöste Variante des Projectdreamlogos, für konventionelle Displays gibt es als Fallback die normal aufgelöste Variante. Weiterlesen

Urlaubsfoto pimpen

Wer hat sie nicht, die goldene Erinnerung? Mit der Zeit verblassen alle hässlichen Dinge und die schönen treten in den Vordergrund. Jetzt hatte ich das Problem, daß meine Urlaubsfotos aber die nackte Wahrheit (links) zeigen:

Die nackte Wahrheit und die goldene Erinnerung!

Die nackte Wahrheit und die goldene Erinnerung!

Weiterlesen