Wie mache ich in Photoshop eine transparente Überblendung für die Unterfarbe (dh die Unterfarbe)?

1

Ich möchte eine transparente Überblendung für die darunter liegende Farbe vornehmen, damit es möglich ist, die Farbe dynamisch (über JS) zu ändern, ohne den Effekt der Überblendung zu verlieren. Wie würde ich das in Photoshop machen?

Siehe folgendes Bild:

Fade

adobe-photoshop  javascript  css 
— 3498DB
quelle
Ich habe kein Photoshop, daher kann ich das nicht testen: mediacollege.com/adobe/photoshop/transparent/gradient.html
— hyperslug

Antworten:

1

So was:

  1. Erstellen Sie ein neues Bild.
  2. Erstellen Sie eine neue Verlaufsebene: Ebene & gt; Neue Füllebene & gt; Gradient
  3. OK klicken.
  4. Stellen Sie den Stil auf linear und den Winkel auf 90 ein.
  5. Doppelklicken Sie auf den Farbverlauf
  6. Stellen Sie die Deckkraft für den Anschlag ganz links auf 0% und die Deckkraft für den Anschlag ganz rechts auf 100% ein.
  7. Stellen Sie die Farbe für beide Stopps auf den gleichen Grauton ein, den Sie für die Volltonfarbe wünschen.
  8. OK klicken.
  9. Verwenden Sie "Für Web speichern", um das Bild als PNG zu speichern.
— Guffa
quelle
@Guffa, wenn Sie nicht für beide Stopps eine Farbe auswählen, hat das Bild dann eine Alpha-Transparenz mit Farbverlauf?
— hyperslug
@hyperslug: Beide Stopps haben immer eine Farbe, Sie können keine Farbe auswählen. Wenn Sie nicht für beide die gleiche Farbe verwenden, erhalten Sie zusammen mit dem Ausblenden auch einen Farbverlauf. Es ist der Opazitätsgradient, der den Ausblendeffekt hervorruft, an dem Sie interessiert sind.
— Guffa
0

Im Allgemeinen gehören diese Fragen dem Superuser. Aber ich kann eins sagen. Sie müssen Transparenz im Bild verwenden, soweit ich mich erinnere, dass IE die Transparenz von PNG oder zumindest die "feine" Transparenz nicht unterstützt (abhängig von der Version, die Sie unterstützen müssen). AFAIK IE unterstützt nur transparent oder nicht und beginnt mit IE7.

Möglicherweise möchten Sie eine JS-Bildbibliothek verwenden.

— Artyom
quelle
Ja, aber wie macht man eine solche Transparenz im Bild?
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.