• Heim > Web-Frontend > CSS-Tutorial > Flimmereffekt gesteuert durch CSS_CSS/HTML

    Flimmereffekt gesteuert durch CSS_CSS/HTML

    WBOY
    Freigeben: 2016-05-16 12:11:03
    Original
    2122 Leute haben es durchsucht

    Um einen Text oder ein Bild herum blinkt dieser Halo einmal pro Sekunde. Wenn die Maus darüber bewegt wird, hört er sofort auf zu blinken, und wenn die Maus wegbewegt wird, blinkt er weiter. Dieser Effekt wird für Inhalte genutzt, die besondere Aufmerksamkeit von anderen benötigen (z. B. Warnungen, Meldungen über neue Inhalte usw.) und kann bessere Ergebnisse erzielen.

    Da es sich um ein aufgenommenes Bild handelt, ist der dynamische Effekt nicht zu erkennen. Befolgen Sie einfach die unten vorgestellte Methode und probieren Sie es aus. Die Produktionsidee lautet: Verwenden Sie den CSS-Filter „Glow“, um einen Halo-Effekt zu erzeugen, verwenden Sie die sich dynamisch ändernden Eigenschaften von CSS und ändern Sie den Eigenschaftswert jede Sekunde, um einen Flackereffekt zu erzielen. Verwenden Sie dann zwei Ereignisse (. onmouseover und onmouseout), um das Javascript-Programm aufzurufen und zu steuern, ob das Flackern erfolgen soll.

    Produktionsmethode:

    1. Erstellen Sie einen Glow-Filter. Informationen zum Einrichten von CSS-Filtern finden Sie im entsprechenden Artikel unter „CSS-Filter-Anwendungstipps“. Es wird hier nicht wiederholt. Für Internetnutzer, die Dreamweaver nicht verwenden, kopieren Sie bitte den folgenden Code zwischen 〈head〉 und 〈/head〉 des Quellcodes der Webseite:

     〈style type="text/css"〉

     

    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage