دورة Html الدرس 11 - النص المتحرك Marquee

اليوم درسنا مع وسم( الدالة \ الكود \ tag ) جديد وهو marquee
و يستخدم هذا الـ tag من أجل إنشاء نصوص متحركة أو صور
الطريقة الأساسية المبسطة له:

كود HTML:

<marquee>دورة تعلم html من محترفي الكمبيوتر</marquee>

قم بنسخ الكود ولصقه في محرر أكواد Html
و سترى النتجية وهي نص متحرك من اليمين إلى اليسار

خصائص هذا الوسم:
تحديد العرض و الارتفاع:
يتم ذلك باستخدام الخاصة width , heigh

كود HTML:

<marquee width=200 heigh=50>
دورة برمجة المواقع على محترفي الكمبيوتر
</marquee>

حيث يكون للنص المتحرك مساحة محددة لا يتجاوزها
وبتطبيقك للكود تتوضح الفكرة

الخاصة direction
تستخدم لتحديد اتجاه الحركة و لها نوعين من اليمين right و من اليسار left
المثال :

كود HTML:

<marquee direction="left">محترفي الكمبيوتر</marquee>
<marquee direction="right">محترفي الكمبيوتر</marquee>

الخاصة behavior
لها ثلاثة أشكال وهي لتحديد طريقة الحركة
لنرى كل منها بالتفصيل
1- النوع : alternate
في هذا النوع عندما يصل النص المتحرك إلى النهاية يعود إلى البداية من حيث انتهى
مثال :

كود HTML:

<marquee behavior=alternate>محترفي الكمبيوتر</marquee>

2- النوع scroll
عند وصول النص للنهاية يتابع طريقه ثم يظهر من البداية و هي نفس الحالة الطبيعية لاستعمال هذا الوسم بدون خصائص
مثال :

كود HTML:

<marquee behavior=scroll>محترفي الكمبيوتر</marquee>

3- الخاصة slide
عند وصول النص للنهاية يتوقف عن الحركة :

كود HTML:

<marquee behavior=slide>محترفي الكمبيوتر</marquee>

مثال يوضح الأنواع الثلاثة لرؤية الفرق بينهم:

كود HTML:

<marquee behavior=alternate>محترفي الكمبيوتر</marquee>
<marquee behavior=scroll>محترفي الكمبيوتر</marquee>
<marquee behavior=slide>محترفي الكمبيوتر</marquee>

خاصة scrolldelay
للتحكم بسرعة حركة النص ( لإنقاص السرعة فقط \ التبطيء )
وقيمتها تكون بالميلي ثانية
حيث أن كل 1 ثانية = 1000 ميلي ثانية

كود:

1 sec = 1000 m sec

مثال على نص سرعة كل انتقال فيه نصف ثانية :

كود HTML:

<marquee scrolldelay="500">محترفي الكمبيوتر</marquee>

الخاصة scrollamount
وهي بعكس سابقتهاscrolldelay حيث تستخدم هذه للتسريع ( زيادة السرعة )
وكلما زاد الرقم زادات السرعة
مثال توضيحي جربه و انظر السرعة

كود HTML:

<marquee scrollamount="20">محترفي الكمبيوتر</marquee>
<marquee scrollamount="50">محترفي الكمبيوتر</marquee>

الخاصة loop
للتحكم بعدد مرات التكرار
مثال

كود HTML:

<marquee loop="2">محترفي الكمبيوتر</marquee>

الخاصة bgcolor
للتحكم بلون خلفية النص المتحرك
<marquee bgcolor="blue">طه سوفت للبرامج</marquee>
حيث يمكن كتابة اللون أو الكود الخاص به
وسنتوسع بالحديث عن الألوان مع دروس css

يوجد خصائص أخرى مثل hspace و vspace للتحكم بالانزياح العمودي و الافقي
و غيرهم ولكن لن نطيل الحديث كثيراً فما تم ذكره كافي للتعامل مع النصوص المتحركة في html

ملاحظة :
يمكن وضع صور بدل النصوص بشكل متحرك
مثال :

كود HTML:

<marquee><img src="http://img805.imageshack.us/img805/46/1234u.gif"/></marquee>

حيث استعملنا الوسم img بدلاً من كتابة النص فقط
طبعاً الأمثلة السابقة كلها تصبح أوضح مع التطبيق و الممارسة
مع التمنيات بالتوفق للجيمع و اعذرونا على التأخر بطرح الدروس بسبب الانشغال