القائمة المنسدلة DIV (2)
الكاتب:Eve Cole
وقت التحديث:2009-06-20 17:00:56
يمكنك وضع هذا البرنامج بين علامتي <head></head>، أو في أي مكان على صفحة الويب.
بعد ذلك، يتعين علينا تحديد عناصر القائمة الفعلية لدينا. نحتاج هنا إلى إضافة مقبض حدث حركة الماوس (OnMouseOver) إلى كل عنصر قائمة، والسماح لهذا الحدث باستدعاء وظيفة العرض التي حددناها أعلاه. بمعنى آخر، بمجرد دخول الماوس إلى عنصر القائمة، يبدأ تنفيذ وظيفة العرض. هنا، نحتاج أيضًا إلى تحديد رقم معرف لكل عنصر من عناصر القائمة لدينا، وتمرير اسم معرف عمود القائمة المنسدلة الخاص به إلى وظيفة العرض، وهذا أمر بالغ الأهمية بالنسبة لنا للتحكم في عمود القائمة المنسدلة الموجود أسفل I إعطاء اسم معرف عنصر القائمة وصف بناء جملة HTML:
<حدود الجدول=0>
<تر>
<td ID="d1" onmouseover="show(this,ds1);" class="menu">موقع تكنولوجيا المجلة</td>
<td ID="d2" onmouseover="show(this,ds2);" class="menu">البوابة</td>
<td ID="d3" onmouseover="show(this,ds3);" class="menu">الموقع الشخصي المفضل</td>
</tr>
</الجدول>
أخيرًا، يتعين علينا تحديد عمود القائمة المنسدلة. بالنسبة لكل عمود من أعمدة القائمة المنسدلة، نحتاج إلى منحه سمة CSS الخاصة بالقائمة الفرعية، واسم معرف حتى تتمكن وظيفة العرض الخاصة بنا من التحكم فيه، وأخيرًا، قمنا بتعيين وضع العرض الافتراضي الخاص به على لا شيء، مما يعني أنه لن يكون كذلك معروض. يتم تحقيق ذلك عن طريق تعيين "لا شيء" لنمط العرض الخاص به. أدناه، قدمت وصفًا لبناء جملة HTML لعمود القائمة المنسدلة:
<معرف DIV = "ds1" فئة = "submenu" STYLE = "عرض: لا شيء">
<BR><A HREF="http:\www.yesky.com">tianji.com Yesky.com</A>
<BR><A HREF="http:\www.cbinews.com">معلومات الأعمال التجارية على الكمبيوتر</A>
<BR><A HREF="http:\www.newsoft.com.cn">إلكترونيات الموضة الجديدة</A>
<ر>
</DIV>
<معرف DIV = "ds2" فئة = "القائمة الفرعية" STYLE = "عرض: لا شيء">
<BR><A HREF="http:\www.sina.com.cn">سينا سينا</A>
<BR><A HREF="http:\www.sohu.com.cn">سوهوسوهو</A>
<BR><A HREF="http:\www.163.com">نيتياس</A>
<ر>
</DIV>
<معرف DIV = "ds3" فئة = "submenu" STYLE = "عرض: لا شيء">
<BR><A HREF="http:\haoel.yeah.net">محطة برمجة شبكة الماوس</A>
<BR><A HREF="http:\www.5460.net">زملاء الدراسة الصينيين</A>
<BR><A HREF="http:\www.csdn.net">شبكة تطوير البرمجيات الصينية</A>
<ر>
</DIV>
هذه هي العملية برمتها، مع الخطوات الأربع المذكورة أعلاه، ستتمكن بالتأكيد من رؤية القائمة، ضعها على صفحة الويب الخاصة بك وسوف تبدو جميلة بالتأكيد. بالطبع، يمكنك أيضًا محاولة تغيير خصائص القائمة بنفسك لجعلها أشبه بالقائمة.