أولئك الذين كتبوا HTML لفترة طويلة قد يتذكرون العنصر. كان هذا عنصرًا خاصًا بالمتصفح أنشأ شعارًا لتمرير النص عبر الشاشة. لم يتم إضافة هذا العنصر إلى ملف لغة البرمجة تباينت مواصفاتها ودعمها على نطاق واسع عبر المتصفحات. غالبًا ما كان للناس آراء قوية جدًا حول استخدام هذا العنصر - سواء كانت إيجابية أو سلبية. ولكن سواء كنت تحبها أو تكرهها ، فإنها تخدم غرض جعل المحتوى الذي تجاوز حدود الصندوق مرئيًا.
كان ذلك جزءًا من السبب في عدم تنفيذها بالكامل من قبل المتصفحات ، بصرف النظر عن الرأي الشخصي القوي يعتبر تأثيرًا مرئيًا وعلى هذا النحو ، يجب ألا يتم تعريفه بواسطة HTML ، الذي يعرّف بنية. بدلاً من ذلك ، يجب إدارة التأثيرات المرئية أو العرض التقديمي بواسطة CSS. ويضيف CSS3 وحدة التحديد للتحكم في كيفية إضافة المتصفحات لملف تأثير سرادق للعناصر.
خصائص CSS3 الجديدة
يضيف CSS3 خمسة خصائص جديدة للمساعدة في التحكم في كيفية عرض المحتوى الخاص بك في الشاشة الاسمية: نمط الفائض ، وأسلوب الشاشة الاسمية ، وعدد تشغيل الشاشة ، واتجاه الشاشة الاسمية ، وسرعة الشاشة الاسمية.
على غرار الفائض
تحدد خاصية overflow-style (التي ناقشناها أيضًا في المقالة CSS Overflow) النمط المفضل للمحتويات التي تتجاوز مربع المحتوى. إذا قمت بتعيين القيمة على خط مستطيل أو إطار مستطيل ، فسينزلق المحتوى الخاص بك للداخل وللخارج إلى اليسار / اليمين (خط التحديد) أو لأعلى / لأسفل (كتلة مستطيلة).
سرادق نمط
تحدد هذه الخاصية كيف سينتقل المحتوى إلى العرض (والخروج). الخيارات التمرير، وشريحة ، ومناوبة. يبدأ التمرير بالمحتوى خارج الشاشة تمامًا ، ثم ينتقل عبر المنطقة المرئية حتى يصبح كل شيء خارج الشاشة تمامًا مرة أخرى. تبدأ الشريحة بالمحتوى خارج الشاشة تمامًا ، ثم تنتقل عبرها حتى ينتقل المحتوى بالكامل إلى الشاشة ولا يتبقى أي محتوى آخر للانزلاق على الشاشة. أخيرًا ، يؤدي البديل إلى ارتداد المحتوى من جانب إلى آخر ، مع الانزلاق للخلف وللأمام.
سرادق اللعب العد
من عيوب استخدام عنصر MARQUEE أن الشاشة الاسمية لا تتوقف أبدًا. ولكن باستخدام خاصية style-marquee-play-count ، يمكنك تعيين الشاشة الاسمية لتدوير المحتوى وإيقاف تشغيله لعدد معين من المرات.
سرادق الاتجاه
يمكنك أيضًا اختيار الاتجاه الذي يجب أن يمرر فيه المحتوى على الشاشة. تستند القيم إلى الأمام والعكس على اتجاه النص عندما يكون نمط الفائض عبارة عن خط أفقي وأعلى أو لأسفل عندما يكون نمط الفائض عبارة عن كتلة مستطيلة.
تفاصيل اتجاه الخيمة
على غرار الفائض |
اتجاه اللغة | إلى الأمام | يعكس |
|---|---|---|---|
سرادق الخط |
لتر | غادر | حق |
| rtl | حق | غادر | |
سرادق كتلة |
فوق | تحت |
سرادق السرعة
تحدد هذه الخاصية مدى سرعة تمرير المحتوى على الشاشة. القيم بطيئة وعادية وسريعة. تعتمد السرعة الفعلية على المحتوى والمتصفح الذي يعرضه ، ولكن يجب أن تكون القيم بطيئة أبطأ من المعتاد وهو أبطأ من السرعة.
دعم المستعرض لخصائص الشاشة الاسمية
قد تحتاج إلى استخدام بادئات البائع لتشغيل عناصر CSS Marquee. وهم على النحو التالي:
| CSS3 | بادئة البائع |
|---|---|
تجاوز x: خط سرادق ؛ |
تجاوز x: -webkit-marquee ؛ |
سرادق نمط |
-كيت-سرادق-أسلوب |
سرادق اللعب العد |
-كيت-سرادق-التكرار |
سرادق الاتجاه: إلى الأمام | عكسي ؛ |
-webkit-marquee-direction: إلى الأمام | للخلف ؛ |
سرادق السرعة |
سرعة سرادق -webkit |
| لا يوجد ما يعادلها | -webkit-marquee-increment |
تتيح لك الخاصية الأخيرة تحديد حجم الخطوات التي يجب أن تكون كبيرة أو صغيرة أثناء تمرير المحتوى على الشاشة في إطار التحديد.
لكي تعمل الشاشة الاسمية الخاصة بك ، يجب أن تضع قيم المورد مسبوقة أولاً ثم تتبعها بقيم مواصفات CSS3. على سبيل المثال ، يوجد هنا CSS لمستطيل التحديد يمرر النص خمس مرات من اليسار إلى اليمين داخل مربع بحجم 200 × 50.
{
العرض: 200 بكسل ؛ الارتفاع: 50 بكسل ؛ مساحة بيضاء: نوراراب.
إخفاء الفائض؛
تجاوز x: -webkit-marquee ؛
اتجاه سرادق -webkit: إلى الأمام.
-نمط سرادق -webkit: التمرير ؛
سرعة سرادق -webkit: عادي ؛
-webkit-marquee-increment: صغير ؛
-كيت-سرادق-التكرار: 5 ؛
تجاوز x: خط سرادق ؛
سرادق الاتجاه: إلى الأمام ؛
نمط سرادق: التمرير ؛
سرادق السرعة: عادي ؛
عدد سرادق اللعب: 5 ؛
}