HTML/מפת תמונה: הבדלים בין גרסאות בדף

תוכן שנמחק תוכן שנוסף
ארז סגל (שיחה | תרומות)
ארז סגל (שיחה | תרומות)
שורה 32:
 
==יצירת מפת תמונה צד לקוח==
קודם כל ניצור את ה'''מפה'''. אוסף האיזורים והקישור מכל איזור.
 
ראשית ניצור אלמנט map. חובה לתת לו את המאפיין id שכן נקרא לו מאלמנט img אחר כך. שנית, חשוב מאוד לתת לו את המאפיין name ושערכו יהיה זהה לזה של id בשל סיבות של תאימות לאחור.
 
{{קוד מקור||קוד=
<pre>
<map id="MyMap" name="My Map"> </map>
</pre>
}}
 
בתוכו נשים אלמנטים מסוג area. חובה לשים לפחות אחד כזה. אלמנט area מגדיר '''אזור'''. לאיזור יש צורה מוגדרת ופעולה שמתבצעת כאשר לוחצים עליו.
* מאפיין חובה באלמנט area הוא '''alt''' - אלטרנטיבה לדפדפנים שאינם תומכים במפת תמונה.
* מאפיין חשוב הוא '''shape'''. ערך ברירת המחדל שלו הוא rect וניתן לתת לו אחד מארבעת הערכים: rect, circle, poly ו- default. השלושה הראשונים מגדירים צורות כפי שהצגנו בחלק על הגדרת צורות. הרביעי הוא איזור ברירת המחדל - כל פיקסל שלא מכוסה על ידי איזור אחר.
* עוד מאפיין חשוב הוא '''coords'''. ערכו הוא רשימה של קואורדינטות מופרדות על ידי פסיקים. מכיוון שכל קוארדינטה היא זוג מספרים מופרדים על ידי פסיקים, המאפיין הזה הוא בעצם רשימה של מספרים מופרדת על ידי פסיקים.
* במאפיין '''href''' ניתן את הקישור שאליו אנחנו רוצים להפנות את המשתמש אם הוא לחץ על האיזור.
* אם אנחנו לא רוצים לקשר מהאזור, ניתן להשתמש במאפיין הבולאני '''nohref''' בצורה הזו: {{קוד בשורה||1=nohref="nohref"}}.
 
{{קוד מקור||קוד=
<pre>
<map id="MyMap" name="My Map">
<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" target ="_blank" />
</map>
</pre>
}}
 
 
* ל-area יש את מאפייני האירוע ומאפייני המיקוד, בעזרתם ניתן להגדיר אירועים שקשורים לאיזור.
 
==יצירת מפת תמונה צד שרת==
==המאפיינים==