Ich erstelle ein animiertes Logo für meine Website. Es ist ein einfaches 2-Frame-GIF. Der einzige Unterschied zwischen den beiden Frames besteht darin, dass der erste ein leuchtendes Objekt hat und der zweite nicht.
Hier ist der erste Rahmen .
Jetzt, nachdem ich auf „Für Web speichern“ geklickt habe, entscheide ich mich dafür, keine Matte zu verwenden, da die Hintergrundfarbe, die ich auf der Website verwende, ein Farbverlauf ist. Und das schafft dieses hässliche Ding .
Wie ich bereits sagte, kann ich nicht einfach matt verwenden, da die Hintergrundfarbe meiner Website ein grauer und schwarzer Farbverlauf ist.
Kann ich irgendetwas tun? Ich möchte, dass dieses Logo sauber und ohne Linien ist und dass es zum Farbverlauf auf meiner Website passt.
.gifunterstützt keine Alpha-Transparenz, das ist der Grund für die „Linie“ um Ihr Logo. Am einfachsten wäre es, den Farbverlauf in den Hintergrund einzufügen.
Das einzige Problem wäre ein sich dynamisch ändernder Hintergrund. Um Alpha-Transparenz im Web zu erhalten, verwenden Sie eine .png, die keine Animationen unterstützt. Da Sie aber nur zwei Frames haben, können Sie die Animation mit einer einfachen CSS- oder JS-Animation simulieren.
Wie Afterlame vorschlägt, ist die beste Lösung für Ihr Problem entweder:
ODER
Ein Beispiel wäre, ein DIV mit einem Hintergrund Ihres ersten Bildes zu haben und dann den zweiten Rahmen als IMG darin einzufügen. Blenden Sie mit css/js einfach das beigefügte IMG ein und aus, um den gewünschten Effekt zu erzielen.
Zach Saucier