کسانی که از HTML برای مدت زمان طولانی نوشته اند می توانند این عنصر را به خاطر داشته باشند. این عنصر خاص مرورگر بود که یک پرچم متن پیمایش را در سراسر صفحه ایجاد کرد. این عنصر هرگز به مشخصات HTML اضافه نشد و پشتیبانی از آن به طور وسیع در مرورگرها متنوع بود. مردم اغلب در مورد استفاده از این عنصر - مثبت و منفی برخوردار بودند. اما آیا شما آن را دوست داشتید یا از آن نفرت داشتید، به هدف ایجاد محتوا که مرزهای جعبه را دیدید سرایت کرد.
بخشی از دلیل که هرگز به طور کامل توسط مرورگرها اجرا نشد، صرف نظر از نظر شخصی قوی، این بود که آن را یک اثر بصری محسوب می شود و به این ترتیب نباید توسط HTML تعریف شود که ساختار را تعریف می کند. در عوض، جلوه های تصویری یا ارائه باید توسط CSS مدیریت شود. و CSS3 ماژول marquee را برای کنترل اینکه مرورگرها اثر مارک را به عناصر اضافه می کند اضافه می کند.
خواص جدید CSS3
CSS3 پنج ویژگی جدید اضافه می کند تا به کنترل چگونگی نمایش محتویات خود در مکان برسد: سبک سرریز، سبک مارک، مارک-بازی-شمارش، مسیر مارکت و سرعت مارک.
سرریز به سبک
خصوصیات overflow-style (که من در مقاله CSS Overflow نیز مورد بحث قرار دادم) سبک ترجیح داده شده برای محتویاتی که در کادر محاوره ای سرریز می شود را مشخص می کند. اگر شما مقدار را به marquee-line یا marquee-block تنظیم کنید، محتوای شما به سمت چپ / راست (marquee-line) یا بالا / پایین (marquee-block) اسلاید خواهد شد.
مارک سبک
این ویژگی تعریف می کند که چگونه محتوای به دید (و خارج) حرکت می کند.
گزینه های پیمایش، اسلاید و جایگزین هستند. حرکت با محتوا کاملا خارج از صفحه شروع می شود و سپس آن را در سراسر منطقه قابل مشاهده حرکت می کند تا زمانی که تمامش کاملا خارج از صفحه باشد. اسلاید با محتویات کاملا خارج از صفحه شروع می شود و سپس آن را در سراسر حرکت می کند تا زمانی که محتوا به طور کامل بر روی صفحه حرکت کند و محتوای دیگر برای اسلاید روی صفحه نمایش وجود ندارد.
در نهایت، جایگزین محتوای را از طرف به سمت باز می کند، به عقب و جلو حرکت می کند.
marquee-play-count
یکی از دلایل استفاده از عنصر MARQUEE این است که مسابقه هرگز متوقف نمی شود. اما با امكانات style marquee-play-count می توانید محوطه را تنظیم كنید تا محتویات را برای چندین بار تغییر دهید.
جهت حرکت
شما همچنین می توانید جهت محتوای محتوایی را بر روی صفحه انتخاب کنید. مقادیر پیش رو و معکوس براساس جهت متن است، زمانی که سبک سرریز خطوط خطی است و بالا یا پایین زمانی که سبک سرریز marquee-block است.
مشخصه جهت
| سرریز به سبک | جهت زبان | رو به جلو | معکوس |
|---|---|---|---|
| خط مارپیچ | لیتر | ترک کرد | درست |
| rtl | درست | ترک کرد | |
| بلوک بلوک | بالا | پایین |
سرعت مسطح
این ویژگی تعیین می کند که محتویات محتویات روی صفحه چگونه است. مقادیر آهسته، نرمال و سریع هستند. سرعت واقعی به محتوا بستگی دارد و مرورگر آن را نمایش می دهد، اما مقادیر باید آهسته تر از حد معمول باشد که از سرعت سریعتر است.
پشتیبانی مرورگر از ویژگی های Marquee
ممکن است لازم باشد از پیشوندهای فروشنده استفاده کنید تا عناصر CSS marquee برای کار استفاده شود. آنها به شرح زیر هستند:
| CSS3 | پیشوند فروشنده |
|---|---|
| overflow-x: marquee-line؛ | overflow-x: -webkit-marquee؛ |
| مارک سبک | -webkit-marquee-style |
| marquee-play-count | -webkit-marquee-تکرار |
| جهت حرکت: جلو | عقب | -webkit-marquee-direction: forwards | backwards؛ |
| سرعت مسطح | -webkit-marquee-speed |
| معادل نیست | -webkit-marquee-increment |
آخرین ویژگی اجازه می دهد تا شما را تعریف کنید که چقدر بزرگ یا کوچک باید مراحل را به عنوان محتویات کتیبه بر روی صفحه نمایش در marquee باشد.
برای اینکه کارتان را انجام دهید، ابتدا مقادیر پیشفرض فروشنده را قرار دهید و سپس آنها را با مقادیر مشخص شده CSS3 دنبال کنید. به عنوان مثال، در اینجا CSS برای محوطه ای است که متن را پنج بار از سمت چپ به راست درون جعبه 200x50 پیمایش می کند.
{
عرض: 200 پیکسل؛ ارتفاع: 50 پیکسل؛ فضای سفید: در حال حاضر؛
سرریز: پنهان؛
overflow-x: -webkit-marquee؛
-webkit-marquee-direction: forwards؛
-webkit-marquee-style: پیمایش؛
-webkit-marquee-speed: عادی؛
-webkit-marquee-increment: کوچک؛
-webkit-marquee-repetition: 5؛
overflow-x: marquee-line؛
جهت حرکت: به جلو؛
مارچلی سبک: اسکرول؛
سرعت مارک: عادی؛
مسابقات بازی: تعداد 5؛
}