الوسوم الخاصة 1
MS Internet Explorer
[الأساسيات]
[الألوان]
[الخطوط]
[الفقرات والقوائم]
[الصور والرسومات]
[الوصلات التشعبية]
[الجداول1]
[الجداول2]
[الإطارات1]
[الإطارات2]
[الإطارات3]
[وسوم من هنا وهناك]
[الخرائط الصورية]
[النماذج1]
[النماذج2]
[الوسوم الخاصة]
[الويب واللغة العربية]
[وسوم Meta]
ملاحظة مهمة: تحتوي هذه الصفحة على وسوم خاصة بالمتصفح MS Internet Explorer فإذا كان متصفحك خلاف ذلك فلن تستطيع مشاهدة الصفحة بالصورة المناسبة
<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>
وهي -كما تعلم- طريقة عامة ليس لها علاقة بنوع المتصفح المستخدم
Once Upon A Time One Man's Dream
<MARQUEE> ... </MARQUEE>
ما رأيك بهذا النص المتسكع أمامك على الشاشة؟ جميل ..أليس كذلك؟ هذه اللافتة (إن جاز التعبير) هي إحدى المؤثرات الخاصة التي يمكن إحداثها في MS Explorer. بواسطة هذه الوسوم. وبكل بساطة هذه هي الشيفرة الخاصة بذلك
<MARQUEE>
H.P in arabic
</MARQUEE>
بالطبع لا يمكن أن تمر الأمور هنا ببساطة فلا بد من وجود خصائص لهذه الوسوم، والحقيقة أن هناك إحدى عشرة خاصية نستخدمها (عدد ليس بالقليل بالنسبة لوسوم خاصة). لكنها على أية حال ليست صعبة التطبيق بل إننا تعاملنا بشكل أو بآخر معها مسبقاً وخاصة مع الوسم <IMG> وهذه هي الخصائص أسردها لك مع الأمثلة:
BGCOLOR: لتحديد لون الخلفية
<MARQUEE BGCOLOR="#FF0000">
H.P in arabic
</MARQUEE>
HEIGHT: لتحديد إرتفاع اللافتة، وهي إما أن تأخذ قيمة ثابتة أو قيمة نسبية حسب إرتفاع نافذة المتصفح.
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80">
H.P in arabic
</MARQUEE>
WIDTH: لتحديد عرض اللافتة، وهنا أيضاً إما أن تأخذ قيمة ثابتة أو نسبية
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%">
H.P in arabic
</MARQUEE>
ALIGN: لتحديد المحاذاة العمودية للنص الذي قد يتواجد على جانبي اللافتة، وهي تأخذ القيم top, middle و bottom وهي الإفتراضية أي التي تطبق تلقائياً عند عدم إدراج هذه الخاصية.
Welcome to
Welcome to Have a good time.
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%">
H.P in arabic
</MARQUEE>
Have a good time.
Welcome to
Welcome to Have a good time.
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" ALIGN="middle">
H.P in arabic
</MARQUEE>
Have a good time.
Welcome to
Welcome to Have a good time.
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" ALIGN="top">
H.P in arabic
</MARQUEE>
Have a good time.
HSPACE: لتحديد المسافة الفارغة التي تفصل بين اللافتة وبين النص الموجود على جانبيها
Welcome to
Welcome to Have a good time.
<MARQUEE BGCOLOR="#FF0000" HEIGHT="80" WIDTH="40%" HSPACE="30">
H.P in arabic
</MARQUEE>
Have a good time.
VSPACE: تعمل مثل الخاصية السابقة لكنها تحدد المسافة الفارغة عمودياً من الأعلى والأسفل
حتى الآن كانت الخصائص التي ناقشناها مجرد خصائص مظهرية تتعلق بشكل ومظهر اللافتة دون تغيير طريقة عملها. والآن نأتي إلى الخصائص الفنية:
BEHAVIOR تحدد سلوك النص الموجود في اللافتة وطريقة عمله وهناك ثلاثة قيم (أو بالأحرى) ثلاثة أساليب لحركة النص وهي التالية:
scroll يتحرك بنفس الإتجاه من جانب إلى آخر وبصورة مستمرة وهي القيمة الإفتراضية، لذلك لا يهم إن كتبت أم لا.
slide يتحرك النص مرة واحدة من جانب إلى الجانب الآخر ويتوقف عنده.
<MARQUEE BGCOLOR="#FF0000" WIDTH="80%" BEHAVIOR="slide">
H.P in arabic
</MARQUEE>
من المحتمل أن يكون النص في المثال أعلاه متوقفاً بعد أن يكون قد أكمل تحركه، لذلك قم بالنقر على زر Refresh الموجود في متصفحك لإعادة تحميل الصفحة وتحريك النص مرة أخرى
alternate يتأرجح النص جيئة وذهاباً من جانب إلى آخر.
<MARQUEE BGCOLOR="#FF0000" WIDTH="80%" BEHAVIOR="alternate">
H.P in arabic
</MARQUEE>
DIRECTION تحدد إتجاه سير النص وذلك من خلال القيم left التي تحركه إلى اليسار (وهي الإفتراضية) و right التي تحركه إلى اليمين.
<MARQUEE BGCOLOR="#FF0000" WIDTH="80%" DIRECTION="right">
H.P in arabic
</MARQUEE>
LOOP تحدد عدد المرات التي سيتحرك فيها النص داخل اللافتة. فإذا أردت أن تستمر الحركة إلى ما لا نهاية فضع القيمة -1 أو infinite وبخلاف ذلك ضع عدد المرات التي تريدها. والشيفرة التالية تحدد عدد مرات الحركة بثلاث. (إذا وجدت النص ساكناً أو لم تجد نصاً على الإطلاق فهذا يعني أنه قد استنفذ حركاته الثلاث لذلك تحتاج للنقر على Refresh لإعادة تشغيله)
<MARQUEE BGCOLOR="#FF0000" WIDTH="80%" DIRECTION="right" LOOP="3">
H.P in arabic
</MARQUEE>
بقي لدينا الآن خاصيتين تقومان بتحديد سرعة تحرك النص في اللافتة وقبل أن نناقشهما دعني أروي لك هذه القصة:
في غابر الأزمان، حدثنا أستاذ الفيزياء يا سادة يا كرام، أن الأفلام المتحركة ما هي إلا مجموعة من الصور الثابتة أو اللقطات التي يتم عرضها بصورة متعاقبة خلال فترة زمنية معينة، مما يعطي الإنطباع بوجود الحركة. وسرعة عرض اللقطات وتعاقبها هو ما يحدد سرعة الحركة للفيلم. فمثلاً مشهد السيارة المسرعة هو مجرد مجموعة من الصور الثابتة لهذه السيارة في مواقع مختلفة على الشاشة. وبما أن لافتاتنا هي شكل من أشكال الأفلام المتحركة فإن هذا المبدأ يسري عليها أيضاً... إلى هنا وانتهت القصة!
والآن إليك الخصائص:
SCROLLAMOUNT: هذه الخاصية تحدد المسافة بين كل لقطة وأخرى للنص وهي تأخذ قيماً عددية صحيحة تحدد المسافة المقطوعة بالبيكسل (أعرف أنها صعبة قليلاً لكن لا بأس سأوضحها بالأمثلة).
<MARQUEE SCROLLAMOUNT="1"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="50"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="100"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="200"> HTML </MARQUEE>
في الحالة الأولى فإن المسافة التي تقطعها كلمة HTML في كل حركة لها هي 1 بيكسل. أما في المثال الثاني فالمسافة هي 50 بيكسل أي أن الكلمة تقفز 50 بيكسل في كل خطوة (أو لقطة) بما يساوي 50 ضعفاً عن المثال السابق وهذا ما يعطي الإنطباع بالسرعة، وهكذا الأمر للمثالين اللاحقين وهما 100 و 200 بيكسل على التوالي.
SCROLLDELAY: لكي نحدد الزمن الذي يستغرقه النص في القفز بين كل خطوة وأخرى نستخدم هذه الخاصية، والقيمة المعطاه مع هذه الخاصية تمثل الزمن بالميلي ثانية (0.001 من الثانية)
سوف أستخدم نفس الأمثلة السابقة مع هذه الخاصية لنقارن بين النتائج في الحالتين:<MARQUEE SCROLLAMOUNT="1" SCROLLDELAY="500"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="50" SCROLLDELAY="500"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="100" SCROLLDELAY="500"> HTML </MARQUEE>
<MARQUEE SCROLLAMOUNT="200" SCROLLDELAY="500"> HTML </MARQUEE>
لقد أسندت القيمة 500 لهذه الخاصية في جميع الأمثلة وهي تعني أن هناك فترة نصف ثانية (بالتمام والكمال) تفصل بين كل خطوة وأخرى للكلمة. وأعتقد أن ما تراه الآن يوضح لك مبدأ عمل الخاصية السابقة أيضاً. وبالمناسبة، قد تضطر للإنتظار دهراً كاملاً لكي ترى النص في المثال الأول.
ما رأيك الآن لو نلغي الخاصية SCROLLAMOUNT لنرى كيف تعمل SCROLLDELAY لوحدها
<MARQUEE SCROLLDELAY="500"> HTML </MARQUEE>
|
الصفحة التالية |
عودة إلى |
| إتش.بي بالعربية © 1998-1999 يحيى الشريف |
 |
H.P in arabic © 1998-1999 Yahya Al-Sharif |