Dy fan dy dy't in skoft letter HTML skriuwe, kinne it elemint oanpasse. Dit wie in browser-spesifike elemint dy't in banner fan it skermjen fan tekst oer it skerm makke. Dit elemint waard noait taheakke oan de spesifikaasje fan HTML en stipe foar it ferskaat breed oer browsers. Minsken hiene faak sterke mieningen oer it brûken fan dit elemint - sawol posityf as negatyf. Mar as jo jo leafde of haat ha, hat it it doel dien om ynhâld te meitsjen dat de kasteldegingen sichtber binne.
In diel fan 'e reden is it nea folslein ynfierd troch browsers, útsein fan sterke persoanlike miening, wie dat as in fisuele eftergrûn beskôge en as sadanich, it moat net definiearre wurde troch de HTML, dy't de struktuer beskiedt. Ynstee dêrfan moatte fisuele of presintaasjene effekten beheard wurde troch CSS. En CSS3 addt de marktmodule om te kontrolearjen hoe browsers de markearre effekt oan eleminten taheakje.
Nije CSS3-eigenskippen
CSS3 tafoegde fiif nije eigenskippen om te kontrolearjen hoe't jo ynhâld yn 'e markearje sjen: oerflow-styl, marktestyl, markearre-spieler-sifer, markearringsrjochting en markearrings.
oerflow-styl
It eigendom fan it oerflak-styl (dat ik ek besprutsen yn it artikel CSS Overflow) beskiedt de foarkommende styl foar ynhâld dy't de ynhâldtafel oerflaket. As jo de wearde yn markearje-ljepper of markearje-blokkearje, sille jo ynhâld yn en nei rjochts / rjochts (marke-line) of op / del (marktblok) slide.
marquee-styl
Dit eigenskip beskied hoe't de ynhâld yntsjinne wurdt (en út).
De opsjes binne scrollen, slide en alternatyf. Scrollen begjint mei de ynhâld folslein út it skerm, en dan ferpleatst it oer it sichtbere gebiet oant it altyd folslein skermôfbylding is. Slide begjint mei de ynhâld folslein út it skerm en dan giet it omheech, oant de ynhâld folslein op it skerm bewegt en der gjin ynhâld mear oerlitten wurdt op it skerm.
Lêstendal stipet alternatyf de ynhâld fan 'e sydkant oan' e kant, skodearjend en rint.
marquee-play-count
Ien fan 'e tekoartingen fan it gebrûk fan' e MARQUEE-elemint is dat de markearring noait stopet. Mar mei de styl eigendom marquee-play-count kinne jo de markearje ynstelle om de ynhâld yn en út te setten foar in bepaalde tal kearen.
Marke-rjochting
Jo kinne ek de rjochting kieze dy 't de ynhâld scrollen op it skerm. De wearden foarôfgean en reverse binne basearre op de direksje fan 'e tekst as de oerflak-styl markearre-line en op of del is as de oerflow-styl markearre is.
Marke-Direction Details
| oerflow-styl | Taalrjochting | foarút | reverse |
|---|---|---|---|
| marquee-line | ltr | links | rjochts |
| rtl | rjochts | links | |
| marquee-block | op | omleech |
marquee-speed
Dit eigenskip bepale hoe fluch de ynhâld yn it skerm skowe. De wearden binne stad, normaal, en fluch. De eigentlike fluggens hinget ôf fan de ynhâld en de blêder dy't it sjen lit, mar de wearden moatte langer slower wêze as normaal dy't slimmer as rap.
Browser-stipe fan de Marke-eigenskippen
Jo kinne miskien ferplichtingen brûke om de CSS-markearrings eleminten te krijen om te wurkjen. Se binne sa:
| CSS3 | Vendor Prefix |
|---|---|
| overflow-x: marquee-line; | oerflow-x: -webkit-marquee; |
| marquee-styl | -webkit-marquee-styl |
| marquee-play-count | -webkit-marquee-repetysje |
| marquee-rjochting: foarút | reverse; | -webkit-marquee-direction: foarwards | efterôf; |
| marquee-speed | -webkit-marquee-speed |
| gjin lykweardich | -webkit-marquee-ynkommens |
It lêste eigendom jout jo om te definiearjen hoe grut of lyts de stappen soene moatte wurde as de ynhâld op it skerm skriuwt yn 'e markearring.
Om jo gearwurking te hawwen, moatte jo de ferfanger earder prefiksje wearden plakken sette en folgje dan mei de CSS3-specifikaasjewearden. Bygelyks hjir is de CSS foar in markearring dy't de tekst fyftich fan 'e lofts nei rjochts skriuwt yn in boek 200x50.
{
width: 200px; hichte: 50px; wyt-romte: nowrap;
oerflak: ferburgen;
oerflow-x: -webkit-marquee;
-webkit-marquee-direction: foarwards;
-webkit-marquee-styl: scroll;
-webkit-marquee-speed: normal;
-webkit-marquee-inkrement: lyts;
-webkit-marquee-repetysje: 5;
overflow-x: marquee-line;
marquee-rjochting: foarút;
marquee-styl: scroll;
marquee-speed: normal;
marquee-play-count: 5;
}