Búa til skruna efni í HTML5 og CSS3 án MARQUEE

Þeir sem hafa verið að skrifa HTML í langan tíma geta muna þáttinn. Þetta var vafra-sérstakur þáttur sem bjó til borði af flassandi texta yfir skjáinn. Þessi þáttur var aldrei bætt við HTML forskriftina og stuðningur við það var fjölbreytt víða yfir vafra. Fólk hafði oft mjög sterkar skoðanir um notkun þessa þáttar - bæði jákvæð og neikvæð. En hvort sem þú elskaðir eða hataði það, þjónaði það tilganginn með því að gera efni sem flýtti sér um kassagöngin sýnileg.

Hluti af þeirri ástæðu að það var aldrei fullkomlega útfærður af vöfrum, fyrir utan sterkan persónuleg álit, var að það er talið sjónræn áhrif og sem slík ætti það ekki að vera skilgreint af HTML sem skilgreinir uppbyggingu. Þess í stað ætti að hafa umsjón með sjón- eða kynningaráhrifum af CSS. Og CSS3 bætir merkjamálareiningunni við til að stjórna því hvernig vafrar bæta við merkisáhrifum á þætti.

Nýr CSS3 eignir

CSS3 bætir fimm nýjum eiginleikum til að hjálpa til við að stjórna því hvernig innihaldið þitt birtist í tjaldhólinu: flæðisstíll, merkisstíll, markvörður-tónleikar, markvörður og markarhraði.

flæða stíl
Eiginleikinn flæðisstíll (sem ég ræddi einnig í greininni CSS Overflow) skilgreinir valinn stíll fyrir innihald sem flæðir yfir innihaldslokann. Ef þú stillir gildið á merkjalínu eða torgblokk mun innihaldið þitt renna inn og út til vinstri / hægri (merkislínuna) eða upp / niður (merkja-blokk).

tjaldstæði
Þessi eign skilgreinir hvernig efnið muni flytja inn í skoðun (og út).

Valkostirnir eru skrúfa, renna og til skiptis. Skrun byrjar með efnið alveg af skjánum, og þá færist það yfir sýnilegt svæði þar til það er allt alveg af skjánum aftur. Slide byrjar með innihaldi alveg af skjánum og þá fer það yfir þar til innihaldið er að fullu flutt á skjáinn og ekkert efni er eftir til að renna á skjánum.

Að lokum skýtur varamaður efnið frá hlið til hliðar, renna fram og til baka.

tjaldstæði
Eitt af gallunum við að nota MARQUEE frumefni er að markið hættir aldrei. En með glæsileiknum, getur þú stillt merkimiðann til að snúa efninu til og frá fyrir tiltekinn tíma.

marquee-direction
Þú getur einnig valið áttina sem innihaldið ætti að fletta á skjánum. Gildin áfram og afturábak eru byggðar á stefnu texta þegar flæðisstíllinn er markastig og upp eða niður þegar flæðisstíllinn er markaður.

Marquee-Direction Upplýsingar

marka-hraði
Þessi eign ákvarðar hve fljótt innihaldið rollar á skjánum. Gildin eru hæg, venjuleg og hratt. Raunverulegur hraði veltur á innihaldi og vafranum sem sýnir það, en gildin verða að vera hægur er hægari en venjulega sem er hægari en hratt.

Stuðningur við vafra Marquee Properties

Þú gætir þurft að nota seljandaforskeyti til að fá CSS merkjamálin til að vinna. Þau eru sem hér segir:

Síðasta eignin gerir þér kleift að skilgreina hversu stór eða smá skrefin ættu að vera þegar innihaldið rollar á skjánum í sýningunni.

Til þess að þú getir virkjað merkið þitt ættir þú fyrst að setja seljanda fyrirfram tilgreind gildi og fylgdu þá með CSS3 forskriftunum. Til dæmis, hér er CSS fyrir tjaldstæði sem flettir textanum fimm sinnum frá vinstri til hægri innan 200x50 kassa.

{
breidd: 200px; hæð: 50px; hvítt rúm: nowrap;
flæða: falinn;
overflow-x: -webkit-marquee;
-webkit-marquee-átt: áfram;
-webkit-marquee-stíl: fletta;
-webkit-marquee-hraði: eðlilegt;
-webkit-marquee-hækkun: lítil;
-webkit-marquee-repetition: 5;
flæða-x: merkja-lína;
Markvörður: áfram;
merkisstíll: fletta;
Markvörður: venjulegur;
Markvörður: 5;
}