Hoe maak die teks flikker in HTML

Knipperende teks was nog nooit deel van standaard HTML funksies nie en daar is geen benadering wat vir elke blaaier werk nie. Die naaste opsie wat slegs HTML gebruik, is die merker (of merketiket) -tag, maar selfs dit werk nie in Google Chrome nie. jаvascript is `n meer betroubare metode en jy kan die kode direk in die HTML-dokument kopieer en plak.

conținut

Stappe
Metode 1gebruik die marquee tag
Metode 2gebruik jаvascript
Wenke
Waarskuwings

stappe

Metode 1
Gebruik die marquee tag

Prent getiteld Maak teks knip in HTML Stap 1

Gebruik dit slegs in persoonlike projekte. Die merketiket het verouderd geword en ontwikkelaars word sterk aangemoedig om dit te vermy. Verskillende blaaiers sal dit anders vertoon, en toekomstige opdaterings kan voorkom dat die teks glad nie flikker nie. Leer hoe om jаvascript te gebruik in plaas daarvan om `n professionele webwerf te skep.

Google Chrome ondersteun nie die kenmerk nie "scrollamount", wat die een is wat hierdie metode ondersteun. In hierdie blaaier sal die teks deur die bladsy gaan in plaas van om te flikker.

Prent getiteld Maak teks knip in HTML Stap 2

Plaas die merketikette om die blinkende teks. Open die HTML-dokument in `n eenvoudige teksredigeerder. Tik voor die teks wil jy dit flits. Tik na die teks

Soos altyd, skryf eers die bladsy in HTML met etikette , en .

Prent getiteld Maak teks knip in HTML Stap 3

Stel die teks grootte in Verander die openingsteken na breedte ="300">. Dit sal nie die lettergrootte verander nie. Daar is twee redes waarom jy dalk hierdie nommer moet verander na `n ander een:

As die teks nie pas nie, sal dit beweeg in plaas van om te flikker. Verhoog die grootte om dit te vermy.

In Chrome sal die teks beweeg op `n afstand wat deur die grootte bepaal word.

Prent getiteld Maak teks knip in HTML Stap 4

Stel die skermbedrag in dieselfde waarde as die grootte. Binne dieselfde etiket, skryf scrollamount ="300" (of dieselfde nommer wat grootte het). By verstek beweeg die merktekste langs die bladsy. Deur die skermmoment met dieselfde nommer as die grootte te konfigureer, is die teks "beweeg" In dieselfde posisie is jy. Dit veroorsaak die flikker effek.

Die teks sal lyk soos die volgende:
Knipper teks hier.

Prent getiteld Maak teks knip in HTML Stap 5

Verander die scrolldelay. Open die HTML-lêer in `n webblaaier om die effek te sien. As die teks te stadig of te stadig blink, verander die spoed met die kenmerk scrolldelay ="500". Die verstekwaarde is 85. Gebruik `n hoër getal om stadig of een te blaas om vinniger te flikker.

Nou sal jy:
Knipper teks hier.

Prent getiteld Maak teks knip in HTML Stap 6

Beperk die aantal knippies (opsioneel). Baie gebruikers vind die flikker in die teks irriterend. Om die animasie een keer te stop, het die leser se aandag gevang, tik lus ="7". Die teks sal sewe keer flikker en verdwyn (dit is moontlik om enige nommer behalwe sewe) te gebruik.

Die volledige kode is:
Knipperende teks hier.

Metode 2
Gebruik jаvascript

Prent getiteld Maak teks knip in HTML Stap 7

Voeg `n flikker skrip in die kop van die HTML-dokument. Tussen etikette en van die HTML-dokument, voeg die volgende jаvascript-kode in:

funksie blink teks () {
var f = document.getElementById (`aankondiging`) -
setInterval (funksie () {
f.style.visibility = (f.style.visibility == `hidden`? ``: `hidden`) -
), 1000)
}

Prent getiteld Maak teks knip in HTML Stap 8

Voeg die opdrag in om die skrif te laai. Die kode hierbo beskryf, definieer `n funksie wat geroep het "blinktext". Om hierdie funksie in u HTML te gebruik, verander die etiket om .

Prent getiteld Maak teks knip in HTML Stap 9

Definieer die flikkerende teks as `n "aankondiging". Die skrip raak slegs elemente wat geïdentifiseer is as "aankondiging". Plaas die flikkerende teks binne enige element en gee dit die identiteit. Voer byvoorbeeld in

Knipper teks hier.

Jy kan hierdie naam verander vir alles wat jy wil. Maak seker dat jy dieselfde woord in die skrif en die element gebruik "id".

Prent getiteld Maak teks knip in HTML Stap 10

Pas die skrif aan Die nommer "1000" In die skrif stel dit die tydsperiode tussen knip. Dit is in mikrosekondes, waardeur die waarde 1000 die teks een keer per sekonde flits. Verander dit na `n kleiner getal sodat dit meer keer flikker of vir `n groter een om dit te vertraag.

Die regte tydspasie sal nie perfek met hierdie waarde pas nie. Dit is geneig om effens korter te wees, maar jy mag dalk meer tyd benodig as die leser besig is met ander prosesse.

wenke

U kan die voorkoms van die tekstaampie met die kenmerk verstel "styl". Probeer styl byvoeg"grens: soliede".
Dit is moontlik om `n hoogte-kenmerk in die marquee-tag sowel as een breedte in te sluit, maar baie blaaiers sal dit ignoreer. Jy mag dalk `n verskil maak as jy `n grens aan die markie bygevoeg het.
U kan ook CSS animasies gebruik om die teks te flits. Dit is nogal ingewikkelder en word nie aanbeveel vir CSS-beginners nie. Hou in gedagte dat jy `n CSS dokument gekoppel (teks in Engels) omdat Firefox nie animasies met interne CSS ondersteun nie.