Bilder Reflektion mit JavaScript
Wer Bilder in seine Texte einbaut möchte natürlich auch, dass diese schön dargestellt werden. Aktuell ist es gängig Grafiken spiegeln zu lassen – vor allem Logos sind davon betroffen. Um eine Reflektion zu erstellen bestehen genügend Tutorials im Netz die schön beschreiben wie eine solche Reflektion mit Hilfe von Photoshop schnell erstellen kann.
Es besteht allerdings auch noch die Möglichkeit Bilder einfach mit Hilfe von JavaScript on the fly spiegeln zu lassen, wie das JavaScript reflection.js von featurepics.com schön zeigt.
Um eine Reflektion zu erzeugen ist nach dem Einbinden des JavaScript Files nicht viel Code notwendig. Neben der Klasse “reflect” muss lediglich die Hintergrundfarbe für den Bereich der Reflektion noch gesetzt werden.
<div style="background-color:black;width:200px;"> <img src="http://www.featurepics.com/pics/Standing-Out-Match.jpg" class="reflect" alt="rose on black" border="0"> </div>
Das Script ist knapp 5Kb groß, steht unter der MIT Lizenz und kann direkt heruntergeladen werden.
Also wer nicht die Muse oder Photoshop hat der hat nun einfach die Möglichkeit die Darstellung seiner Bilder einfach aufzuwerten – wer braucht da noch Designer ;)
