Header Ads

HTML - وسم area



وهو خريطة مصورة يمكن النقر على أجزاء معينة منها
<img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap" /><map name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" />
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury" />
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus" />
</map>


المتصفحات الداعمة


متوافق مع متصفح اوبرا متوافق مع متصفح فايرفوكس متوافق مع متصفح جوجل كروم متوافق مع متصفح انترنت اكسبلورر متوافق مع متصفح سفاري

ان وسم <area> متوافق مع جميع المتصفحات الرئيسية

التعريف والاستخدام


يوصف الوسم <area> تحديد أماكن معينة في صورة .
ان الوسم <area> دائماً مرفق بداخل الوسم <map>
ملاحظة: ان اللاحقة usemap في وسم <img> مرفقة مع اللاحقة name الخاصة بوسم <map> والتي بدورها تنشئ علاقة بين الصورة والتحديد

الاختلاف في HTML و XHTML


في HTML لايوجد نهاية للوسم <area>
في XHTML يوجد نهاية بنفس الوسم <area />




اللواحق المطلوبة















اللاحقةالقيمةالشرح
alttextيحدد نص بديل للكود





اللواحق الاختيارية









































AttributeValueDescriptionDTD
coordsCoordinatesيحدد احداثيات الخريطةSTF
hrefURLيحدد وجهة رابط تشعبي للخريطةSTF
nohrefnohrefيبين للخريطة بأنها لاتحتوي على رابط تشعبيSTF
shapedefault
rect
circle
poly
تحدد شكل الخريطةSTF
target_blank
_parent
_self
_top
تحدد كيفية فتح رابط الصفحة المرفق مع الخريطةTF





اللواحق الأساسية













































اللاحقةالشرح
classتستخدم لتحديد اسم أو أكثر لتصنيف أو عنصر معين ( غالباً مايستخدم مع ملف التصميم css )
idتستخدم لتحديد id مخصص لعنصر معين
styleتستخدم لتحديد تصميم CSS داخلي لعنصر معين .
titleتحديد معلومات اضافية عن العنصر .
dirتحديد جهة النص لمحتوى العنصر .
langتحدد اللغة لمحتوى العنصر .
xml:langتحدد لغة محتوى العنصرلصفحة XHTML .
accesskeyتحديد وسم الاختصار لتفعيل أو التركيز على العنصر .
tabindexتحدد رقم الاندكس للعنصر

لمزيد من اللواحق يمكنك التوجه الى قائمة اللواحق الأساسية




لواحق الأحداث events


يدعم وسم <area> عدداً من اللواحق التالية






































اللاحقةالقيمةالشرح
onblurscriptيستخدم السكربت عند عدم التركيز على العنصر .
onchangescriptيستخدم السكربت عند تغير العناصر .
onfocusscriptيستخدم السكربت عند حصول العنصر على التركيز
onresetscriptيستخدم السكربت عند ضبط النموذج .
onselectscriptيستخدم السكربت عند اختيار العناصر .
onsubmitscriptيستخدم السكربت عند الضغط على ارسال للنموذج .

لمزيد من الأحداث يمكنك التوجه الى قائمة الأحداث الأساسية




ليست هناك تعليقات:

يتم التشغيل بواسطة Blogger.