Mereka yang telah menulis HTML untuk sekian lama boleh mengingati elemen tersebut. Ini adalah elemen khusus penyemak imbas yang mencipta spanduk teks menatal merentasi skrin. Unsur ini tidak pernah ditambahkan pada spesifikasi HTML dan sokongan untuknya berbeza-beza di seluruh pelayar. Orang sering mempunyai pendapat yang sangat kuat mengenai penggunaan elemen ini - baik positif dan negatif. Tetapi sama ada anda suka atau membencinya, ia berfungsi sebagai tujuan membuat kandungan yang melimpah pada sempadan kotak yang dapat dilihat.
Sebahagian daripada sebab itu tidak pernah dilaksanakan sepenuhnya oleh pelayar, selain daripada pendapat peribadi yang kuat, adalah dianggap sebagai kesan visual dan oleh itu, ia tidak sepatutnya ditakrifkan oleh HTML, yang mentakrifkan strukturnya. Sebaliknya, kesan visual atau persembahan harus diuruskan oleh CSS. Dan CSS3 menambah modul marquee untuk mengawal bagaimana penyemak imbas menambah kesan marquee kepada elemen.
Hartanah CSS3 Baru
CSS3 menambah lima sifat baru untuk membantu mengawal bagaimana kandungan anda memaparkan dalam kemahuan: gaya limpahan, gaya tenda, kiraan tayang-tayang, arah tenda dan kelajuan marquee.
gaya limpahan
Ciri-ciri gaya limpahan (yang saya juga dibincangkan dalam artikel Overflow CSS) mentakrifkan gaya pilihan untuk kandungan yang melimpah kotak kandungan. Sekiranya anda menetapkan nilai ke barisan marquee-line atau marquee-block anda akan meluncur masuk dan keluar ke kiri / kanan (marquee-line) atau naik / turun (marquee-block).
gaya marquee
Harta ini mentakrifkan bagaimana kandungan akan dipapar (dan keluar).
Pilihannya ialah tatal, slaid dan pengganti. Tatal bermula dengan kandungan sepenuhnya dari skrin, dan kemudian bergerak ke seluruh kawasan yang kelihatan sehingga semua skrin mati sepenuhnya. Slide bermula dengan kandungan sepenuhnya dari skrin dan kemudian bergerak sehingga kandungan telah sepenuhnya bergerak ke skrin dan tidak ada lagi kandungan yang tersisa untuk slaid pada skrin.
Akhir sekali, selebihnya memantul kandungan dari sisi ke sisi, meluncur ke belakang dan sebagainya.
kiraan marquee-play-count
Salah satu kelemahan menggunakan unsur MARQUEE adalah bahawa tenda tidak pernah berhenti. Tetapi dengan gaya perkiraan marquee-play-count anda boleh menetapkan marquee untuk memutar kandungan dan mematikan untuk beberapa kali tertentu.
arah tingkap
Anda juga boleh memilih arah yang kandungannya harus tatal pada skrin. Nilai-nilai ke hadapan dan terbalik adalah berdasarkan arah arah teks ketika gaya limpahan adalah garis marquee dan naik atau turun ketika gaya overflow adalah blok marquee.
Butiran Marquee-Direction
| gaya limpahan | Arah Bahasa | ke hadapan | sebaliknya |
|---|---|---|---|
| talian marquee | ltr | dibiarkan | betul |
| rtl | betul | dibiarkan | |
| blok marquee | up | turun |
kelajuan marquee
Harta ini menentukan betapa cepatnya kandungan skrol pada skrin. Nilai-nilai itu perlahan, normal, dan cepat. Kelajuan sebenarnya bergantung pada kandungan dan pelayar yang memaparkannya, tetapi nilai-nilai yang harus lambat lebih lambat daripada yang normal yang lebih lambat daripada cepat.
Sokongan Penyemak Imbas bagi Marquee Properties
Anda mungkin perlu menggunakan awalan vendor untuk mendapatkan elemen marquee CSS untuk berfungsi. Mereka adalah seperti berikut:
| CSS3 | Awalan Penjual |
|---|---|
| overflow-x: marquee-line; | overflow-x: -webkit-marquee; |
| gaya marquee | -webkit-marquee-style |
| kiraan marquee-play-count | -webkit-marquee-repetition |
| arah-tuju: arah depan | terbalik; | -webkit-marquee-direction: forward | backwards; |
| kelajuan marquee | -webkit-marquee-speed |
| tidak bersamaan | -webkit-marquee-increment |
Harta terakhir membolehkan anda menentukan berapa besar atau kecil langkah-langkahnya sebagai skrol kandungan pada skrin dalam tenda.
Untuk mendapatkan pekerjaan marquee anda, anda perlu meletakkan nilai prefixed vendor terlebih dahulu dan kemudian ikutinya dengan nilai spesifikasi CSS3. Sebagai contoh, di sini adalah CSS untuk tenda yang menatal teks lima kali dari kiri ke kanan dalam kotak 200x50.
{
lebar: 200px; ketinggian: 50px; ruang putih: sekarang;
melimpah: tersembunyi;
overflow-x: -webkit-marquee;
-webkit-marquee-direction: ke hadapan;
-webkit-marquee-style: skrol;
-webkit-marquee-speed: normal;
-webkit-marquee-increment: small;
-webkit-marquee-repetition: 5;
overflow-x: marquee-line;
arah tenda: ke hadapan;
gaya tamadun: tatal;
kelajuan marquee: normal;
perkeranian bermain marquee: 5;
}