قد يتذكر أولئك الذين قاموا بكتابة HTML لفترة طويلة العنصر. كان هذا عنصرًا خاصًا بالمتصفح أنشأ لافتة من نص التمرير عبر الشاشة. لم تتم إضافة هذا العنصر مطلقًا إلى مواصفات HTML ، وقد تفاوت الدعم له على نطاق واسع عبر المتصفحات. غالبًا ما كان لدى الناس آراء قوية جدًا حول استخدام هذا العنصر - سواء كان إيجابًا أو سلبيًا. ولكن سواء كنت تحبها أو تكرهها ، فإنها تخدم الغرض من إنشاء محتوى فاضح لحدود المربع المرئية.
جزء من السبب في عدم تنفيذه بشكل كامل من قبل المتصفحات ، بغض النظر عن رأي شخصي قوي ، هو أنه يعتبر مؤثرًا بصريًا وعلى هذا النحو ، لا يجب تحديده بواسطة HTML ، الذي يحدد البنية. بدلاً من ذلك ، يجب إدارة التأثيرات المرئية أو العروض التقديمية بواسطة CSS. ويضيف CSS3 الوحدة النمطية للتحكم في كيفية قيام المستعرضات بإضافة تأثير الشاشة إلى العناصر.
خصائص CSS3 جديدة
تضيف CSS3 خمس خصائص جديدة للمساعدة في التحكم في كيفية عرض المحتوى الخاص بك في الشاشة الاسمية: نمط تجاوز السطوع ، نمط سرادق ، الشاشة الاسمية للتعداد ، سرادق الاتجاه وسرعة الميل.
على غرار تجاوز
تحدد الخاصية overflow-style (التي ناقشتها أيضًا في المقال CSS Overflow) النمط المفضل للمحتويات التي تفيض مربع المحتوى. إذا قمت بتعيين القيمة إلى سطر اسمية أو حجب الشاشة ، سينزلق المحتوى الخاص بك إلى اليسار / اليمين (خط سرادق) أو أعلى / لأسفل (الشاشة الاسمية).
على غرار سرادق
تحدد هذه الخاصية كيف سينتقل المحتوى إلى العرض (والخروج).
الخيارات هي التمرير والشريحة والبديل. يبدأ التمرير بالمحتوى تمامًا خارج الشاشة ، ثم ينتقل عبر المنطقة المرئية حتى يتم إيقاف تشغيله تمامًا. تبدأ الشريحة بالمحتوى تمامًا خارج الشاشة ، ثم تنتقل إلى أن ينتقل المحتوى بالكامل إلى الشاشة ولا يبقى محتوى آخر ينزلق على الشاشة.
وأخيرًا ، يرتد البديل المحتوى من جانب إلى آخر ، وينزلق ذهابًا وإيابًا.
سرادق للعب العد
إحدى عيوب استخدام عنصر MARQUEE هي أن الشاشة الاسمية لا تتوقف أبداً. ولكن مع خاصية عدد مرات اللعب ، يمكنك تعيين الشاشة الاسمية لتدوير المحتوى وإيقاف تشغيله لعدد محدد من المرات.
سرادق-الاتجاه
يمكنك أيضًا اختيار الاتجاه الذي يجب أن ينتقل المحتوى إليه على الشاشة. تستند القيم إلى الأمام والعكس إلى اتجاه النص عندما يكون نمط overflow-marquee-line وأعلى أو لأسفل عندما يكون نمط تجاوز السعة هو marquee- كتلة.
تفاصيل الشاشة الاسمية
| على غرار تجاوز | اتجاه اللغة | إلى الأمام | عكسي |
|---|---|---|---|
| خط سرادق- | لتر | اليسار | حق |
| ار تي ال | حق | اليسار | |
| سرادق كتلة | فوق | أسفل |
سرادق السرعة
تحدد هذه الخاصية مدى سرعة تمرير المحتوى على الشاشة. القيم بطيئة وطبيعية وسريعة. تعتمد السرعة الفعلية على المحتوى والمتصفح الذي يعرضه ، ولكن يجب أن تكون القيم بطيئة أبطأ من المعتاد وهو أبطأ من السرعة.
دعم متصفح خصائص سرادق
قد تحتاج إلى استخدام بادئات البائع للحصول على عناصر الشاشة الرئيسية لـ CSS للعمل. وهم على النحو التالي:
| CSS3 | بائع البادئة |
|---|---|
| overflow-x: marquee-line؛ | overflow-x: -webkit-marquee؛ |
| على غرار سرادق | على غرار -webkit-سرادق |
| سرادق للعب العد | -webkit-سرادق التكرار |
| سرادق الاتجاه: إلى الأمام | | -webkit-marquee-direction: forward إلى الوراء |
| سرادق السرعة | -webkit-سرادق السرعة |
| لا مكافئ | -webkit-سرادق-زيادة |
تسمح لك الخاصية الأخيرة بتحديد حجم الخطوات الكبيرة أو الصغيرة أثناء تمرير المحتوى على الشاشة في الشاشة الاسمية.
لكي تعمل نافذة التحديد الخاصة بك ، يجب عليك وضع القيم المسبقة للمورد أولاً ثم اتباعها باستخدام قيم مواصفات CSS3. على سبيل المثال ، هنا هو CSS لـ marquee الذي يمرر النص خمس مرات من اليسار إلى اليمين داخل مربع 200x50.
{
العرض: 200 بكسل ؛ الارتفاع: 50 بكسل ؛ مساحة بيضاء: nowrap؛
إخفاء الفائض؛
تجاوز-س: -webkit-سرادق.
-webkit-marquee-direction: forwards؛
-webkit-marquee-style: scroll؛
-webkit-marquee-speed: normal؛
-webkit-marquee-increment: صغير ؛
-webkit-marquee-repetition: 5؛
overflow-x: marquee-line؛
سرادق الاتجاه: إلى الأمام
نمط سرادق: التمرير
سرادق السرعة: عادي
سرادق عدد مرات التشغيل: 5 ؛
}