صورة واحدة بروابط عديدة HTML

منتديات الشباب Net

أود أن اقدم لكم وبدون مقدمات صورة واحدة بروابط عديدة HTML

فى هذا الموضوع سوف اتناول كيفية انشاء صورة واحدة بروابط عديدة (html)
كمثال فى صورة خريطة العالم عند الضغط على قارة افريقيا يذهب الى معلومات عن قارة افريقيا وعند الضغط على اوروبا فى نفس الصورة يذهب الى معلومات عن اوروبا

الصورة التى سوف تستخدم فى المثال



لمعاينة المثال اضغط هنا

الكود (يتم فيه التفريق بين الاحداثيات بتلك العلامة , )

الــرمــز: تحديد المحتوي

<br /><map name="map"><br /><area shape="rec" coords="220,110,360,270" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%81%D8%B1%D9%8A%D9%82%D9%8A%D8%A7" alt="افريقيا"><br /><area shape="circle" coords="490,250,43" href="http://ar.wikipedia.org/wiki/%D8%A3%D8%B3%D8%AA%D8%B1%D8%A7%D9%84%D9%8A%D8%A7" alt="استراليا" ><br /><area shape="poly" coords="261,7,245,61,174,85,126,122,112,162,51,147,36,18,169,1" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%85%D8%B1%D9%8A%D9%83%D8%A7_%D8%A7%D9%84%D8%B4%D9%85%D8%A7%D9%84%D9%8A%D8%A9" alt="امريكا الشمالية" ><br /><area shape="poly" coords="472,217,341,157,339,158,311,109,343,92,342,16,532,18,472,217" href="http://ar.wikipedia.org/wiki/%D8%A2%D8%B3%D9%8A%D8%A7" alt="اسيا" ><br /><area shape="poly" coords="142,138,200,202,165,307,143,307,93,208,108,166,142,138" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%85%D8%B1%D9%8A%D9%83%D8%A7_%D8%A7%D9%84%D8%AC%D9%86%D9%88%D8%A8%D9%8A%D8%A9" alt="امريكا الجنوبية" ><br /><br /></map><br />

الكود الاخر لكن الفرق انه يتم وضع الاحداثيات بين قوسين ( )

الــرمــز: تحديد المحتوي

<br /><map name="map"><br /><area shape="rec" coords="(220,110)(360,270)" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%81%D8%B1%D9%8A%D9%82%D9%8A%D8%A7" alt="افريقيا"><br /><area shape="circle" coords="(490,250)(43)" href="http://ar.wikipedia.org/wiki/%D8%A3%D8%B3%D8%AA%D8%B1%D8%A7%D9%84%D9%8A%D8%A7" alt="استراليا" ><br /><area shape="poly" coords="(261,7)(245,61)(174,85)(126,122)(112,162)(51,147)(36,18)(169,1)" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%85%D8%B1%D9%8A%D9%83%D8%A7_%D8%A7%D9%84%D8%B4%D9%85%D8%A7%D9%84%D9%8A%D8%A9" alt="امريكا الشمالية" ><br /><area shape="poly" coords="(472,217)(341,157)(339,158)(311,109)(343,92)(342,16)(532,18)(472,217)" href="http://ar.wikipedia.org/wiki/%D8%A2%D8%B3%D9%8A%D8%A7" alt="اسيا" ><br /><area shape="poly" coords="(142,138)(200,202)(165,307)(143,307)(93,208)(108,166)(142,138)" href="http://ar.wikipedia.org/wiki/%D8%A3%D9%85%D8%B1%D9%8A%D9%83%D8%A7_%D8%A7%D9%84%D8%AC%D9%86%D9%88%D8%A8%D9%8A%D8%A9" alt="امريكا الجنوبية" ><br /></map><br />

ملحوظة : يتم تحديد الاحداثيات بواسطة برنامج الرسام
عند اختيار rec مستطيل يتم تحديد الركن الايسر العلوى والركن الايمن السفلى ( 2 احداثيات (الركن الايسر العلوى - الركن الايمن السفلى )



عند اختيار circle دائرة يتم تحديد احدائيات مركز الدائرة وطول نصف القطر (احداثيات مركز الدائرة- طول نصف القطر )



عند اختيار poly مضلع يتم تحديد احداثيات كل زاوية من زوايا المضلع بحيث تنتهى بنفس الزاوية التى بدانا بها ( عدد غير محدود من الاحداثيات )





اتمنى ان تكن قد استفتدم معنا في هدا المنتدى

و ان شاء الله يكون الموضوع قد نال رضاكم وانتظروا منا الجديد

شكراً على المرور

مع تحياتي......