Über mich

Startseite arrow Tipps & Tricks arrow Mit GD-Library transparente PNG-Bilder erstellen

Mit GD-Library transparente PNG-Bilder erstellen

Donnerstag, 24. Juli 2008
Geschrieben von Armin Vieweg
Wer ein transparentes PNG-Bild mit Alphachannel möchte muss etwas suchen, bis er das mit der GD-Libary unter PHP hinbekommt. Hier eine kurze Anleitung.

PNG ist besonders gut geeignet, da PNG-Bilder den Alpha-Channel haben. Statt drei Werten (R, G und B) gibt es noch einen vierten der die Transparenz einer Farbe bestimmt.



Im Gegensatz zu GIF, bei dem es nur einen Transparent-Zustand gibt, existieren bei PNG viele Möglichkeiten Dinge auch nur teilweise transparent anzuzeigen.

Beispiel: Lege ich zwei PNG-Bilder übereinander und beide sind mit einer Farbe gefüllt. Das eine Bild 50% Gelb, das andere 50% Blau - dann wird dort wo diese Bilder sich überschneiden grün angezeigt.


Wer solche Bilder in PHP mit der GD-Libary erstellen möchte muss drei kleine Befehlchen beachten.

<?php
  $img = imagecreatetruecolor(250, 80);
  imagesavealpha($img, true);
  $trans_color = imagecolorallocatealpha($img, 255, 255, 255, 127);
  imagefill($img, 0, 0, $trans_color);

  // ...

  imagepng($img, $filename);
?>


Dort wo die drei Pünktchen prangern ist Platz für eigene Definitionen wie das Bild erstellt werden soll.



In meinem Problem heute sollte eine Navigation aus Bildern bestehen, die mit einem Hover-Effekt ausgestattet werden sollte. Das Problem daran war, dass der Kunde diese Punkte selbst ändern können muss. Der Hintergrund der Navigation bestand aus einem Farbverlauf, weshalb ich PNG-Bilder nutzen musste.

Wenn Ihr PNG-Bilder mit Alpha-Transparenz auf Euren Internetseiten nutzt, vergesst nicht den PNG-Fix für den IE6 mit einzubauen - ansonsten gibt es böse Überraschungen.


Ähnlicher Artikel

Transparente PNG Bilder für den Internet Explorer 6





  Kommentare (1)
 1 Geschrieben von: -Sp0ng3b0b-, am 08.10.2011 um 22:05
Danke!
Letzte Aktualisierung ( Freitag, 25. Juli 2008 )
 
< Zurück   Weiter >