الوسوم الخاصة 1

MS
Internet Explorer

 ملاحظة مهمة: تحتوي هذه الصفحة على وسوم
خاصة بالمتصفح MS Internet
Explorer فإذا كان متصفحك خلاف ذلك فلن تستطيع
مشاهدة الصفحة بالصورة المناسبة

··       
أصوات موسيقية

<BGSOUND>

·       
لافتات

<MARQUEE>

<BGSOUND>

هل تأكدت أن مكبرات الصوت في
جهازك تعمل جيداً؟ من المفترض عند دخولك لهذه الصفحة أن تسمع مقطعاً موسيقياً
يُعزف بصورة تلقائية (أرجو أن يعجبك).

تستطيع تعيين أي ملف صوتي يحمل
الإمتداد mid
أو wav
أو au
بحيث يعمل تلقائياً عندما يتم تحميل الصفحة في المتصفح، وذلك باستخدام الوسم <BGSOUND>
(أي BackGround Sound)
فعلى سبيل المثال، قمت بإدراج المقطع الذي تسمعه والمسمى
baladi.mid
بالطريقة التالية

<BGSOUND SRC="baladi.mid">

إذن هناك الخاصية
SRC
والتي تستخدم كما ترى لتحديد اسم الملف المدرج. كما يوجد أيضاً الخاصية
LOOP
التي تحدد عدد مرات تكرار عزف المقطوعة أي أنها تأخذ أرقاماً صحيحة عادة. أما
لو قمت بإعطاءها القيمة ‎-1
أو القيمة infinite
فهذا سوف يؤدي إلى تكرار عزف المقطوعة إلى ما لا نهاية (لا تخف، فهذا لا يعني
أن العزف سيستمر بعد أن تقوم بإطفاء جهازك) فقط سوف تسمعها طالما أنك موجود في
الصفحة وسيتوقف بمجرد انتقالك لصفحة أخرى أو خروجك من البرنامج.

<BGSOUND SRC="baladi.mid"
LOOP="infinite">

<BGSOUND
SRC="baladi.mid" LOOP="3">

أما في حالة أردت إدراج وصلات
تشعبية لملفات صوتية في موقعك بحيث يمكن للزائر أن يحمّلها أو أن ينقر عليها
إذا أراد سماعها، فذلك يتم بالطريقة الإعتيادية لإدراج الوصلات والتي تعلمناها
في
الدرس السادس أي كما يلي:

<A HREF="baladi.mid"> ...
<‎/A>

وهي -كما تعلم- طريقة عامة ليس
لها علاقة بنوع المتصفح المستخدم

span lang=AR-SA dir=LTR>Once
Upon A Time    

One Man's Dream

<MARQUEE>
... <‎/MARQUEE>

H.P in arabic

ما رأيك بهذا النص المتسكع أمامك
على الشاشة؟ جميل ..أليس كذلك؟ هذه اللافتة (إن جاز التعبير) هي إحدى المؤثرات
الخاصة التي يمكن إحداثها في
MS Explorer.
بواسطة هذه الوسوم. وبكل بساطة هذه هي الشيفرة الخاصة بذلك

<MARQUEE>

H.P in arabic

<‎/MARQUEE>

بالطبع لا يمكن أن تمر الأمور
هنا ببساطة فلا بد من وجود خصائص لهذه الوسوم، والحقيقة أن هناك إحدى عشرة
خاصية نستخدمها (عدد ليس بالقليل بالنسبة لوسوم خاصة). لكنها على أية حال ليست
صعبة التطبيق بل إننا تعاملنا بشكل أو بآخر معها مسبقاً وخاصة مع الوسم <IMG>
وهذه هي الخصائص أسردها لك مع الأمثلة:

BGCOLOR:
لتحديد لون الخلفية

<MARQUEE
BGCOLOR="#FF0000">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

HEIGHT:
لتحديد إرتفاع اللافتة، وهي إما أن تأخذ قيمة ثابتة أو قيمة نسبية حسب إرتفاع
نافذة المتصفح.

<MARQUEE BGCOLOR="#FF0000"
HEIGHT="80">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

WIDTH:
لتحديد عرض اللافتة، وهنا أيضاً إما أن تأخذ قيمة ثابتة أو نسبية

<MARQUEE BGCOLOR="#FF0000"
HEIGHT="80" WIDTH="40%">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

ALIGN:
لتحديد المحاذاة العمودية للنص الذي قد يتواجد على جانبي اللافتة، وهي تأخذ
القيم top, middle
و bottom
وهي الإفتراضية أي التي تطبق تلقائياً عند عدم إدراج هذه الخاصية.

Welcome to

<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%">

H.P in arabic

<‎/MARQUEE>

Have a good time.

Welcome to

H.P in arabicHave
a
good time.

 

Welcome to

<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" ALIGN="middle">

H.P in arabic

<‎/MARQUEE>

Have a good time.

Welcome to

H.P in arabicHave
a good time.

 

Welcome to

<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" ALIGN="top">

H.P in arabic

<‎/MARQUEE>

Have a good time.

Welcome to

H.P in arabicHave
a good time.

 

HSPACE:
لتحديد المسافة الفارغة التي تفصل بين اللافتة وبين النص الموجود على جانبيها

Welcome to

<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" HSPACE="30">

H.P in arabic

<‎/MARQUEE>

Have a good time.

Welcome to

H.P in arabicHave
a good time.

VSPACE:
تعمل مثل الخاصية السابقة لكنها تحدد المسافة الفارغة عمودياً من الأعلى
والأسفل

حتى الآن كانت الخصائص التي
ناقشناها مجرد خصائص مظهرية تتعلق بشكل ومظهر اللافتة دون تغيير طريقة عملها.
والآن نأتي إلى الخصائص الفنية:

BEHAVIOR
تحدد سلوك النص الموجود في اللافتة وطريقة عمله وهناك ثلاثة قيم (أو بالأحرى)
ثلاثة أساليب لحركة النص وهي التالية:

·       
scroll
يتحرك بنفس الإتجاه من جانب إلى آخر وبصورة مستمرة وهي القيمة الإفتراضية، لذلك
لا يهم إن كتبت أم لا.

·       
slide
يتحرك النص مرة واحدة من جانب إلى الجانب الآخر ويتوقف عنده.

<MARQUEE BGCOLOR="#FF0000"
WIDTH="80%" BEHAVIOR="slide">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

من المحتمل أن يكون النص في المثال أعلاه متوقفاً بعد أن
يكون قد أكمل تحركه، لذلك قم بالنقر على زر Refresh
الموجود في متصفحك لإعادة تحميل الصفحة وتحريك النص مرة أخرى

·       
alternate
يتأرجح النص جيئة وذهاباً من جانب إلى آخر.

<MARQUEE BGCOLOR="#FF0000"
WIDTH="80%" BEHAVIOR="alternate">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

DIRECTION
تحدد إتجاه سير النص وذلك من خلال القيم
left
التي تحركه إلى اليسار (وهي الإفتراضية) و
right
التي تحركه إلى اليمين.

<MARQUEE BGCOLOR="#FF0000"
WIDTH="80%" DIRECTION="right">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

LOOP
تحدد عدد المرات التي سيتحرك فيها النص داخل اللافتة. فإذا أردت أن تستمر
الحركة إلى ما لا نهاية فضع القيمة ‎-1
أو infinite
وبخلاف ذلك ضع عدد المرات التي تريدها. والشيفرة التالية تحدد عدد مرات الحركة
بثلاث. (إذا وجدت النص ساكناً أو لم تجد نصاً على الإطلاق فهذا يعني أنه قد
استنفذ حركاته الثلاث لذلك تحتاج للنقر على
Refresh
لإعادة تشغيله)

<MARQUEE BGCOLOR="#FF0000"
WIDTH="80%" DIRECTION="right" LOOP="3">

H.P in arabic

<‎/MARQUEE>

H.P in arabic

بقي لدينا الآن خاصيتين تقومان
بتحديد سرعة تحرك النص في اللافتة وقبل أن نناقشهما دعني أروي لك هذه القصة:

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

والآن إليك الخصائص:

SCROLLAMOUNT:
هذه الخاصية تحدد المسافة بين كل لقطة وأخرى للنص وهي تأخذ قيماً عددية صحيحة
تحدد المسافة المقطوعة بالبيكسل (أعرف أنها صعبة قليلاً لكن لا بأس سأوضحها
بالأمثلة).

<MARQUEE SCROLLAMOUNT="1">
HTML <‎/MARQUEE>

HTML

<MARQUEE
SCROLLAMOUNT="50"> HTML <‎/MARQUEE>

HTML

<MARQUEE
SCROLLAMOUNT="100"> HTML <‎/MARQUEE>

HTML

<MARQUEE
SCROLLAMOUNT="200"> HTML <‎/MARQUEE>

HTML

في الحالة الأولى فإن المسافة
التي تقطعها كلمة HTML
في كل حركة لها هي 1 بيكسل. أما في المثال الثاني فالمسافة هي 50 بيكسل أي أن
الكلمة تقفز 50 بيكسل في كل خطوة (أو لقطة) بما يساوي 50 ضعفاً عن المثال
السابق وهذا ما يعطي الإنطباع بالسرعة، وهكذا الأمر للمثالين اللاحقين وهما 100
و 200 بيكسل على التوالي.

SCROLLDELAY:
لكي نحدد الزمن الذي يستغرقه النص في القفز بين كل خطوة وأخرى نستخدم هذه
الخاصية، والقيمة المعطاه مع هذه الخاصية تمثل الزمن بالميلي ثانية (0.001 من
الثانية)

سوف أستخدم نفس الأمثلة السابقة مع هذه الخاصية لنقارن بين النتائج في
الحالتين:

<MARQUEE SCROLLAMOUNT="1"
SCROLLDELAY="500"> HTML <‎/MARQUEE>

HTML

<MARQUEE SCROLLAMOUNT="50"
SCROLLDELAY="500"> HTML <‎/MARQUEE>

HTML

<MARQUEE
SCROLLAMOUNT="100" SCROLLDELAY="500"> HTML <‎/MARQUEE>

HTML

<MARQUEE
SCROLLAMOUNT="200" SCROLLDELAY="500"> HTML <‎/MARQUEE>

HTML

لقد أسندت القيمة 500 لهذه
الخاصية في جميع الأمثلة وهي تعني أن هناك فترة نصف ثانية (بالتمام والكمال)
تفصل بين كل خطوة وأخرى للكلمة. وأعتقد أن ما تراه الآن يوضح لك مبدأ عمل
الخاصية السابقة أيضاً. وبالمناسبة، قد تضطر للإنتظار دهراً كاملاً لكي ترى
النص في المثال الأول.

ما رأيك الآن لو نلغي الخاصية
SCROLLAMOUNT
لنرى كيف تعمل SCROLLDELAY
لوحدها

<MARQUEE
SCROLLDELAY="500"> HTML <‎/MARQUEE>

HTML