Tiuj el vi, kiuj skribis HTML por longa tempo, povas memori la elementon. Ĉi tio estis foliumilo-specifa elemento kiu kreis standardon de movo-teksto tra la ekrano. Ĉi tiu elemento neniam estis aldonita al la HTML-specifaĵo kaj subteno por ĝi variis vaste tra retumiloj. Homoj ofte havis tre fortajn opiniojn pri la uzo de ĉi tiu elemento - ambaŭ pozitivaj kaj negativaj. Sed ĉu vi amis aŭ malamis ĝin, ĝi utilis por fari enhavon, kiu videbligis la kadrojn.
Parto de la kialo neniam estis plene efektivigita de retumiloj, aparte de forta persona opinio, estis ke ĝi konsideras vidan efikon kaj kiel tia, ĝi ne devus esti difinita per la HTML, kiu difinas la strukturon. Anstataŭe, vidaj aŭ prezentoj efikoj devus esti administritaj de CSS. Kaj CSS3 aldonas la marŝan modulon kontroli kiel retumiloj aldonas la marŝan efikon al elementoj.
Novaj CSS3 Propraĵoj
CSS3 aldonas kvin novajn posedaĵojn por helpi kontroli kiel via enhavo montras en la markeo: superflua stilo, markeo-stilo, marke-ludkalkulo, marko-direkto kaj marŝelo-rapido.
superflua stilo
La superflua propraĵo (kiun mi ankaŭ diskutis en la artikolo CSS Overflow) difinas la preferatan stilon por enhavoj, kiuj superfluas la enhavan skatolon. Se vi agordas la valoron al markeo-linio aŭ marko-bloko, via enhavo glitosen kaj maldekstren dekstren / dekstre (marke-linio) aŭ supren / malsupren (marke-bloko).
markeo-stilo
Ĉi tiu propraĵo difinas kiel la enhavo moviĝos en vido (kaj ekstere).
La ebloj estas rulumi, gliti kaj alterni. Scroll komenciĝas per la enhavo tute ekstere de ekrano, kaj tiam ĝi moviĝas trans la videbla areo ĝis ĝi tute tute ekstere ekranon. Diapozitivoj komenciĝas per la enhavo tute ekstere de ekrano kaj poste ĝi translokiĝas ĝis la enhavo plene moviĝis sur la ekranon kaj ne plu enhavo lasis gliti sur la ekrano.
Laste alternas resaltas la enhavon de flanko al flanko, glitante reen kaj eksteren.
marke-lud-kalkulo
Unu el la malfacilaĵoj de uzado de la MARQUEE-elemento estas, ke la marko neniam ĉesas. Sed kun la stilo proprieto marquee-play-count vi povas agordi la marŝon por turni la enhavon ekstere kaj ekstere por specifa nombro de fojoj.
marquee-direkto
Vi povas ankaŭ elekti la direkton, kiun la enhavo devas ruli sur la ekrano. La valoroj antaŭen kaj reverŝajne estas bazitaj sur la direkteco de la teksto kiam la superfluo-stilo estas marŝu-linio kaj supre aŭ malsupren kiam la superfluo-stilo estas marko-bloko.
Detaloj de Marquee-Direction
| superflua stilo | Lingvo Direkto | antaŭen | reversa |
|---|---|---|---|
| markeo-linio | ltr | maldekstra | dekstre |
| rtl | dekstre | maldekstra | |
| marko-bloko | supre | malsupren |
marquee-rapido
Ĉi tiu propraĵo determinas kiom rapide la enhavo moviĝas sur la ekrano. La valoroj estas malrapidaj, normalaj kaj rapidaj. La reala rapido dependas de la enhavo kaj la retumilo montranta ĝin, sed la valoroj devas esti malrapidaj pli malrapidaj ol normalaj, kiuj estas pli malrapidaj ol rapide.
Foliumilo Subteno de la Marquee Properties
Vi eble bezonos uzi prefiksojn de vendisto por akiri la CSS-marĉajn elementojn por funkcii. Ili estas kiel sekvas:
| CSS3 | Vendisto-prezo |
|---|---|
| superflua-x: marke-linio; | superfluo-x: -kolĉa marko; |
| markeo-stilo | -laŭta-marke-stilo |
| marke-lud-kalkulo | -kempa-marko-ripeto |
| marquee-direction: antaŭa | reversa; | -kribuka-marke-direkto: antaŭen | malantaŭen; |
| marquee-rapido | -kvanto-marko-rapido |
| neniu ekvivalenta | -kreska-marko-pliigo |
La lasta posedaĵo permesas vin difini kiom grandaj aŭ malgrandaj la paŝoj devus esti kiel la enhavo movaj sur la ekrano en la markeo.
Por ke via markeo funkciu, vi unue devas anstataŭigi al la vendisto prefiksajn valorojn kaj sekvi ilin per la CSS3-specifaj valoroj. Ekzemple, jen la CSS por marko, kiu movas la tekston kvin fojojn de maldekstre al dekstre en 200x50-skatolo.
{
larĝa: 200px; alteco: 50px; blanka-spaco: nowrap;
superfluo: kaŝita;
superfluo-x: -kolĉa marko;
-vizaĝo-marko-direkto: antaŭen;
-kolora-marke-stilo: scroll;
-klara-marko-rapido: normala;
-granda-marko-pliigo: malgranda;
-subsigno-marko-ripeto: 5;
superflua-x: marke-linio;
marquee-direction: antaŭa;
marquee-style: scroll;
marquee-speed: normala;
marquee-play-count: 5;
}