Wie Man Eine Taste Zum Blinken Bringt

Inhaltsverzeichnis:

Wie Man Eine Taste Zum Blinken Bringt
Wie Man Eine Taste Zum Blinken Bringt

Video: Wie Man Eine Taste Zum Blinken Bringt

Video: Wie Man Eine Taste Zum Blinken Bringt
Video: LED Blink/Blitz Schaltung ohne Mikrocontroller | Erklärung der Grundschaltung & Praxistest 2024, Kann
Anonim

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".

Wie man eine Taste zum Blinken bringt
Wie man eine Taste zum Blinken bringt

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“).

Empfohlen: