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 />


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

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

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

Attribute Value Description DTD
coords Coordinates يحدد احداثيات الخريطة STF
href URL يحدد وجهة رابط تشعبي للخريطة STF
nohref nohref يبين للخريطة بأنها لاتحتوي على رابط تشعبي STF
shape default
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> عدداً من اللواحق التالية

اللاحقة القيمة الشرح
onblur script يستخدم السكربت عند عدم التركيز على العنصر .
onchange script يستخدم السكربت عند تغير العناصر .
onfocus script يستخدم السكربت عند حصول العنصر على التركيز
onreset script يستخدم السكربت عند ضبط النموذج .
onselect script يستخدم السكربت عند اختيار العناصر .
onsubmit script يستخدم السكربت عند الضغط على ارسال للنموذج .

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