Need, kes on pikka aega HTML-i kirjutanud, võivad seda elementi meelde jätta. See oli brauseri-spetsiifiline element, mis lõi ekraanil kerimisriba bänneri. HTML-i spetsifikatsioonile ei lisanud seda elementi kunagi, ja selle toetus oli brauserite lõikes väga erinev. Inimestel oli sageli väga tugevaid arvamusi selle elemendi kasutamise kohta - nii positiivsed kui ka negatiivsed. Kuid kas teid armastas või viidi, oli see eesmärk selleks, et muuta sisu, mis ületas karppiiri nähtavaks.
Osa sellest, mida brauserid kunagi täielikult ei rakendanud, olid tugeva isikliku arvamuse kõrval selle poolest, et seda peetakse visuaalseks efektiks ja sellisena ei tohiks seda määratleda struktuuriga määratletav HTML. Selle asemel peaks CSS-i abil juhtima visuaalseid või esitusviise. Ja CSS3 lisab marquee-mooduli, et kontrollida, kuidas brauserid elementidele marquee efekti lisada.
Uued CSS3 omadused
CSS3 lisab viis uut omadust, mis aitab kontrollida, kuidas teie sisu kuvatakse marquee: üleliigne stiilis, marquee-stiilis, marquee-play-count, marquee-suunas ja marquee-kiirus.
ülevoolu-stiilis
Ülevoolu stiilis vara (mida ma ka artiklis CSS ülevoolu osas arutles) määratleb sisukasti üleliigse sisu eelistatud stiili. Kui määrate marquee-line'i või marquee-block'i väärtuse, libistatakse sisu sisestamiseks ja väljumiseks vasakule / paremale (marquee-line) või üles / alla (marquee-block).
marquee stiilis
See omadus määrab, kuidas sisu liigub vaatesse (ja välja).
Võimalused on sirvida, libistada ja asendada. Kerimine algab sisu täielikult välja lülitatud ekraaniga ja siis liigub see nähtavale alale, kuni see kõik on ekraanilt täiesti välja lülitatud. Slide algab sisu täiesti väljalülitatud ekraaniga ja siis liigub see edasi, kuni sisu on ekraanile täielikult liigutanud ja ekraanile slaidil enam sisu järele pole.
Lõpuks, asendusliige põrkab sisu küljelt küljele, libistades edasi-tagasi.
marquee-play-count
MARQUEE elemendi kasutamise üheks puuduseks on see, et marquee ei lõpe kunagi. Aga stiilis vara marquee-play-count saate seadistada marquee, et sisu teatud ajavahemiku jooksul sisse ja välja lülitada.
marquee-suunas
Saate valida ka selle, kuidas sisu peaks ekraanil sirvida. Edasised ja vastupidised väärtused põhinevad teksti suuna määramisel, kui ületäitumise stiil on marquee-line ja üles või alla, kui üleliigne stiil on marquee-block.
Marquee-Direction üksikasjad
| ülevoolu-stiilis | Keele suund | ettepoole | tagurpidi |
|---|---|---|---|
| marquee-line | ltr | lahkus | õige |
| rtl | õige | lahkus | |
| marquee-block | üles | alla |
marquee-kiirus
See omadus määrab, kui kiiresti sisu ekraanil keritakse. Väärtused on aeglane, normaalne ja kiire. Tegelik kiirus sõltub sellest, milline sisu ja brauser kuvab seda, kuid need peavad olema aeglased, kui tavaline, mis on aeglasem kui kiire.
Marquee omaduste brauseri tugi
CSS marquee elementide tegemiseks võib tekkida vajadus kasutada tarnija eesliiteid . Need on järgmised:
| CSS3 | Vendori eesliide |
|---|---|
| overflow-x: marquee-line; | overflow-x: -webkit-marquee; |
| marquee stiilis | -webkit-marquee stiilis |
| marquee-play-count | -webkit-marquee-kordus |
| telk-suund: edasi | tagurpidi; | -webkit-marquee-suunas: edasi | tagurpidi; |
| marquee-kiirus | -webkit-marquee-kiirus |
| samaväärne pole | -webkit-marquee-juurdekasvu |
Viimane vara võimaldab määratleda, kui suured või väikesed sammud peaksid olema, kui sisu kerib ekraani ekraanil.
Selleks, et oma maatükk töötaks, peate esmalt asetama müüja eelistatud väärtused ja järgima neid CSS3 spetsifikatsiooni väärtustega. Näiteks siin on CSS-i maatüki jaoks, mis kerib teksti viiekordselt lahtrisse 200 x 50 suunas vasakult paremale.
{
laius: 200px; kõrgus: 50px; valge ruum: nüüd;
ülejääk: peidetud;
overflow-x: -webkit-marquee;
-webkit-marquee-suunas: edasi-tagasi;
-webkit-marquee-stiilis: kerige;
-webkit-marquee-speed: normaalne;
-webkit-marquee-juurdekasv: väike;
-webkit-marquee-kordamine: 5;
overflow-x: marquee-line;
marquee-suund: edasi;
marquee-stiilis: kerige;
marquee-speed: normaalne;
marquee-play-count: 5;
}