Bilder, die sich ändern, um ein anderes anzuzeigen, wenn der Cursor darüber positioniert wird, werden Rollover-Bilder genannt. Sie sind eine großartige Möglichkeit, Produkte zu präsentieren oder Inhalte für Besucher interaktiver zu gestalten. Diese Bilder werden auch häufig in Marketing-E-Mails verwendet, wo sie vielleicht weniger willkommen sind. Die Bilder werden mit CSS und HTML erstellt, aber wenn Sie nach einer einfachen UI-basierten Methode suchen, um sie zu erstellen, ist das Rollover-Tool von FreshInbox genau das Richtige für Sie.
Bevor Sie beginnen, stellen Sie sicher, dass Sie die beiden Bilder haben, die Sie in das Rollover-Bild aufnehmen möchten. Von den beiden Bildern erscheint eines, wenn der Cursor nicht darüber positioniert ist, während das andere erscheint, wenn der Cursor auf das Bild bewegt wird. Ihre Bilder können sowohl im PNG- als auch im JPG-Format vorliegen. Laden Sie sie auf ein Cloud-Laufwerk oder einen Bildfreigabedienst wie Imgur hoch und gehen Sie dann zum Rollover-Tool von FreshInbox.
Geben Sie unter Primäre Bild-URL die URL des Bildes ein, das angezeigt werden soll, wenn sich der Mauszeiger nicht über dem Bild befindet. Geben Sie die Breite und Höhe des Bildes an, und geben Sie unter Alternative Bild-URL die URL des Bildes ein, das angezeigt wird, wenn der Cursor darüber positioniert wird.
Geben Sie als Nächstes eine Weiterleitungs-URL in das Feld „Link“ ein. Wenn ein Benutzer auf Ihr Rollover-Bild klickt, wird er zu der URL weitergeleitet, die Sie hier eingeben. Geben Sie ALT-Text ein und klicken Sie auf „Generieren“. Sie sehen rechts eine Vorschau des Bildes und erhalten Codes zum Hinzufügen des Bildes zu Ihrer Website oder E-Mail.
Wenn Sie möchten, dass das Bild responsive ist, aktivieren Sie die Option „Bild auf Containerbreite skalieren“, jedoch nur, wenn Sie wissen, wie man mit Containern arbeitet. Lassen Sie die Option für ein normales Rollover-Bild deaktiviert. Um es in eine E-Mail oder eine Webseite einzufügen, kopieren Sie den Code und fügen Sie ihn in das Tag ein, für das er bestimmt ist, zB Überschrift für E-Mail und Text für Webseite. Das ist alles, was Sie brauchen, um ein Rollover-Bild zu erstellen.
Besuchen Sie das Rollover-Tool von FreshInbox