Maranéhanana anjeun anu geus nulis HTML keur lila bisa apal unsur. Ieu unsur browser-spésifik nu dijieun banner of ngagulung téks nyilangan layar. Unsur ieu pernah ditambahkeun kana spésifikasi HTML jeung rojongan pikeun eta variatif lega sakuliah panyungsi. Jalma sering ngalaman pendapat pisan kuat tentang pamakean unsur ieu - duanana positif jeung negatif. Tapi naha anjeun dipikacinta atawa hated dinya, éta tuh ngalayanan Tujuan nyieun eusi nu overflowed wates kotak ditingali.
Bagian tina alesan eta ieu pernah pinuh dilaksanakeun ku panyungsi, kumisan ti pendapat pribadi kuat, éta nu eta dianggap éfék visual jeung sakumaha misalna, sakuduna teu dihartikeun ku HTML, nu ngahartikeun kana struktur tembok. Gantina, épék visual atawa presentasi kudu diurus ku CSS. Sarta CSS3 nambihan modul marquee ngadalikeun kumaha panyungsi nambahkeun efek marquee mun elemen.
Pasipatan CSS3 Anyar
CSS3 nambihan lima sipat anyar pikeun mantuan ngadalikeun kumaha mintonkeun eusi anjeun dina marquee nu: mudal-gaya, marquee-gaya, marquee-muter-count, marquee-arah sarta marquee-speed.
mudal-gaya
The mudal-gaya sipat (anu kuring ogé dibahas dina artikel CSS mudal) ngahartikeun gaya pikaresep keur eusi nu overflows kotak eusi. Lamun ngeset nilai ka marquee-garis atanapi marquee-meungpeuk eusi anjeun bakal ngageser asup jeung kaluar ka kénca / katuhu (marquee-garis) atawa up / handap (marquee-block).
marquee-gaya
sipat ieu ngahartikeun kumaha eusi bakal mindahkeun kana pintonan (jeung kaluar).
Pilihan téh ngagugulung, slide na alternatif. Gulung dimimitian ku eusi sagemblengna kaluar layar, lajeng eta ngalir di sakuliah wewengkon ditingali nepika kabeh ditumpes kaluar layar deui. Slide dimimitian ku eusi sagemblengna kaluar layar lajeng eta ngalir di sakuliah dugi eusi geus pinuh dipindahkeun onto layar tur euweuh deui eusi ditinggalkeun ngageser dina layar.
Anu pamungkas, alternatif mantul eusi ti sisi ka sisi, ngageser deui mudik.
marquee-muter-count
Salah sahiji drawbacks tina ngagunakeun unsur MARQUEE éta marquee nu pernah eureun. Tapi kalawan harta gaya marquee-muter-count Anjeun tiasa nyetel marquee ka muterkeun eusi sareng mareuman pikeun jumlah nu tangtu kali.
marquee-arah
Anjeun oge bisa milih arah anu eusi kudu ngagulung dina layar. Nilai gancang sareng sabalikna anu dumasar kana directionality téks nalika mudal-gaya anu marquee-garis na kaluhur atanapi kahandap lamun mudal-gaya anu marquee-block.
Rincian Marquee-arah
| mudal-gaya | arah basa | di payun | ngabalikeun |
|---|---|---|---|
| marquee-garis | ltr | ditinggalkeun | bener |
| RTL | bener | ditinggalkeun | |
| marquee-block | ka luhur | turun |
marquee-speed
sipat ieu nangtukeun sabaraha gancang ka scrolls eusi dina layar. Nilai anu slow, normal, sarta gancang. Laju sabenerna gumantung kana eusi jeung browser mintonkeun eta, tapi nilai kudu slow nya laun ti normal nu laun ti gancang.
Browser Rojongan tina Pasipatan Marquee
Anjeun bisa jadi kudu make ngajual émbohan pikeun meunangkeun elemen CSS marquee kana karya. Éta nyaéta kieu:
| CSS3 | ngajual Rarangkén Hareup |
|---|---|
| mudal-x: marquee-garis; | mudal-x: -webkit-marquee; |
| marquee-gaya | -webkit-marquee-gaya |
| marquee-muter-count | -webkit-marquee-pengulangan |
| marquee-arah: neraskeun | ngabalikeun; | -webkit-marquee-arah: payun | tukang; |
| marquee-speed | -webkit-marquee-speed |
| henteu sarua | -webkit-marquee-increment |
Harta panungtungan ngidinan Anjeun pikeun nangtukeun sabaraha ageung atanapi alit léngkah kedah salaku scrolls eusi dina layar di marquee nu.
Dina raraga mibanda kerja marquee, anjeun kedah nempatkeun ngajual prefixed nilai heula lajeng tuturkeun sareng nilai spésifikasi CSS3. Contona, di dieu teh CSS pikeun marquee yén scrolls téks lima kali ti kénca ka katuhu di jero hiji kotak 200x50.
{
lebar: 200px; jangkungna: 50px; bodas-spasi: nowrap;
mudal: disumputkeun;
mudal-x: -webkit-marquee;
-webkit-marquee-arah: payun;
-webkit-marquee-gaya: gulung;
-webkit-marquee-speed: normal;
-webkit-marquee-increment: leutik;
-webkit-marquee-pengulangan: 5;
mudal-x: marquee-garis;
marquee-arah: maju;
marquee-gaya: gulung;
marquee-speed: normal;
marquee-muter-count: 5;
}