Eine blinkende Schaltfläche ist ein Webdesign-Element, das dazu beiträgt, eine Seite hell und attraktiv zu gestalten. Wenn Sie diesen Effekt verwenden, müssen Sie jedoch an den Komfort der Benutzer denken: Missbrauchen Sie nicht die plätschernden "Chips".
Anleitung
Schritt 1
Wenn die erforderliche Schaltfläche als Link-Bild dargestellt wird und die Farbe ändert, nachdem Sie den Mauszeiger darüber bewegt haben, erstellen Sie sie mit der Tabelle und den onMouseOver- und onMouseOut-Attributen.
Taste
Schritt 2
Sie können mit JavaScript einen blinkenden Button erstellen. Damit der Effekt beim Bewegen der Maus wirksam wird und nach dem Entfernen des Cursors ausgeblendet wird, verwenden Sie den folgenden Code: Tab-Überschrift arrColor = ["0", "1", "2", "3", "4", "5 ", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"]; Funktion mouseOut () {for (i = 0; i <13; i ++) setTimeout ('document.blinkbutton.button.style.background = "#" + arrColor [15-i] + '0' + arrColor [15 -i] + 'FFF";', i * 50); } Funktion mouseOver () {for (i = 0; i <15; i ++) setTimeout ('document.blinkbutton.button.style.background = "#' + arrColor + '0' + arrColor + 'F31"; ', ich * 50); }
Schritt 3
Wenn Sie Adobe Photoshop zur Hand haben, können Sie direkt im Grafikeditor einen Blinkeffekt erstellen. Erstellen Sie dazu eine neue Datei sowie neue Ebenen, deren Anzahl der Summe der Frames entsprechen sollte. Wählen Sie anschließend im rechten Bereich die erste Ebene mit einem "Auge" aus und öffnen Sie den Punkt "Animation" aus dem Menü "Fenster". Klicken Sie im angezeigten Bedienfeld auf die Schaltfläche „Rahmen duplizieren“, bewegen Sie das „Auge“auf die nächste Ebene und so weiter. Klicken Sie mit der rechten Maustaste auf jedes Bild und stellen Sie die Zeit ein. Zeigen Sie das Ergebnis in der Vorschau an, ändern Sie es bei Bedarf und speichern Sie es im GIF-Format („Für Web speichern“).