png> save for web.

• 

  Erwin

  13-03-2005 10:24

  Ik wil een figuur opslaan in photoshop met een transparante background…Dus ik deed “save for web…” en dan als png.

  Daarna zet ik hem in dreamweaver en dan zie je dat de achtergrond inderdaad transparant is. Maar als ik op F12 (voorbeeld) druk dan werkt dat transparante niet meer..?

  Kan iemand mij helpen?

  Rapporteren
• 

  prive

  13-03-2005 21:52

  Beste Erwin,

  Kan het zijn omdat de achtergrond kleur van je website wit is?

  Transparantie kun je het beste gebruiken om layered objecten te maken.

  Bijvoorbeeld meerdere fotos over elkaar. Zover ik weet is het niet

  mogelijk om een volledige transparant plaatje te hebben in een browser.

  Je zou in het ontwerp de achtergrond kleur van je pagina mee kunnen calculeren.

  Hoop dat het helpt!! :-)

  Rapporteren
• 

  Angel

  05-04-2005 19:15

  Beste Erwin,

  je wil een png plaatje transparant maken, dit is ook een beetje afhankelijk met wat voor browser je werkt. Je kan een png ook wel transparant maken maar dan werk je met codes in je website:

  Png transparantie in IE en FF werkt als volgt, ik weet niet of je met css style sheets werkt?? maar dit is wat je zou kunnen doen.

  Ten eerste maken we twee id's aan in css.

  De ene id gaan we maken voor IE (Internet Xplorer), zodat deze transparante PNG's goed weergeeft en geen lelijk grijs vak eromheen. De tweede wordt voor de andere browsers gebruikt, waaronder FF (FireFox). Deze hebben namelijk wel een fatsoenlijk PNG support.

  #pngIE {

  fillter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=locatie/naamplaatje.png');

  background-repeat:no-repeat;

  }

  #pngFF{

  background-image:url(locatie/naamplaatje.png);

  background-repeat:no-repeat;

  }

  In deze id's kun je natuurlijk de andere attributen naar vrije wil gebruik. Denk hierbij aan width en height en dergelijke.

  Nu je dat hebt toegevoegd aan je stylesheet, heb je nog geen stylesheet sla bovenstaande code dan op als: styles.css.

  Nu de PHP code:

  De code zet je neer op de plek waar je de id wilt gebruiken. Dus waar je PNG plaatje komt te staan.

  Hier de code:

  Het bovenstaande script bekijkt wat de gebruikers zijn browser is en wijst vervolgens het goede id toe.

  Vergeet bovenaan tussen je en niet de volgende regel neer te zetten om de stylsheet te includen:

  Zo nu heb je je PNG'tje goed zichtbaar in IE en komt hij ook te voorschjn zonder kleerscheuren in FF

  Rapporteren