اخر الاخبار: --- البرامج التي تهدف إلى تعطيل عملية تشغيل الحاسب --- لم اجد حل سهل في حل مشكله من الهاكات ومني لكم هذا --- هل يمكن الحصول علي هاك الشكر --- هاك شكل جديد لحالة العضو --- هل يوجد --- هاك Theme Color Changer --- هاك الأحصائيات الشاملة --- هاك استايل للهاتف --- شرح اضافة كود ميتا تاغ لوصف المنتدى في محركات البحث --- وضع اعلانات ادسنس داخل المواضيع لمنتديات ماي بيبي mybb 1.8 --- طريقة اضافة بادئة للمواضيع بشكل انيق لمنتديات mybb --- شرح رفع وتفعيل هاك لمنتديات ماي بيبي mybb 1.8 --- مشكلة واريد حل في اسرع وقت --- ممكن هاك --- هاك DVZ Shoutbox 2.1. للنسخة 1.8 --- هاك انشاء صفحات اضافية (OUGC-Pages-1.0.0) --- هاك ايقونه حسابك بالفيس - Facebook profile link on Postbit 1.8 --- هاك القايمه الجانبيه المتحركه - sidebar mybb 1.8 --- هاك الطقس - weather for mybb 1.8 --- هاك اعضاء المجموعات - View Groups MYBB 1.8 ---

تحديث آخر نسخة 1.8.37

تقييم الموضوع :
  • 0 أصوات - بمعدل 0
  • 1
  • 2
  • 3
  • 4
  • 5
درس إنشاء خرائط الصور
#1
إنشاء خرائط الصور
اول سؤال ممكن يخطر ببالكم ما معنى خرائط الصور؟
الجواب ببساطة هو ان نضع صورة واحده على صفحة الويب بحيث تحتوي على العديد من المناطق التي يمكن للمستخدم النقر عليها ولها اسم ثاني وهو البقع الساخنه.
طيب نجي الحين الى تطبيق صغير كمثال بسيط :-
1.قم بتحميل صورة في إيمدج ريدي باستخدام أمر openمن قائمة file . يجب أن تكون هذه الصورة ذات خلفية شفافة. بستخدم الصورة التالية الي قمت بتصميمها بخلفية شفافية عموما راح اترك لكم حرية اختيار الصورة الي تعجبكم.
[صورة: 10000770164766bfe238a67.gif]
2. أختر إحدى أدوات خرائط الصور من صندوق الأدوات ثم أنقر فوق الصورة وقم بإنشاء الخريطة . طبعا ملاحظين عدة اشكال الدائري والمضلع والمستطيل
لاحظوا الصورة
[صورة: 2768997824766c028dca87.gif]
انا اخترت الشكل الدائري وحددت المنطقة الي داخل كما هو موضح بالصورة
[صورة: 19760507454766c047a83f3.gif]
3.إذا أردت تحريك منطقة خريطة الصورة فانقر فوقها واسحب باستخدام أداة Image Map select . رمز الاداة موضح بالصورة
[صورة: 2402582814766c0840e402.gif]
4.افتح لوحة خريطة الصور باختيار أمر Show Image Map من قائمة Window . حدد عنوان URL الذي ستشير إليه خريطة الصورة. يمكنك أيضا إدخال اسم لخريطة الصورة ورسالة بديله بحيث يراها المستخدمون الذي لا يعرضون الرسومات. بيطلع البوكس الموضح بالصورة طبعا انا اكتفيت بتعبئة الاسم واليو ار ال تقدرون انتوا تملون الخانات المتبقية.
[صورة: 1251680514766c0aff1643.gif]

5. انا اعدت الخطوات 2 و3 و4 بنسبة للاجزاء الاخرى بالصورة وهي الثلاث اقسام المتبقية.
5. أحفظ الصورة باختيار أمر Save Optimized من قائمة File . وفي مربع الحوار، تأكد أن الخيار HTML & Image محدد من قائمة أنواع الملفات. سيؤدي هذا إلى إنشاء ملف HTML به الاوامر اللازمة لتحميل خريطة الصورة في صفحه الويب.

[صورة: 12523020494766c0ed7c0ab.gif]
6. لمشاهده النتيجة النهائية شوفوا الملف التالي .
[صورة: 9q9q.net.gif]


ملاحظة : سوف لن يتم إعادة رفع الصور لهذا الدرس في حال حذفها من الموقع الذي تم عليه الرفع ، فيمكنك عزيزي القارئ او القارئة ان تقرأ الدرس و تخبرني بالنقطة التي لم تفهمها وساقوم باعادة تلك النقطة فقط .
الصمــــــــــــــــــــــــــت سيد اللغات

بالصمت نقول كلمات كثيرة دون ان نتكلم
:f::f:
الرد
شكر من طرف :


الردود في هذا الموضوع
درس إنشاء خرائط الصور - بواسطة المتألقة - 2007-12-17, 07:58 PM
Re: درس إنشاء خرائط الصور - بواسطة Pepo - 2007-12-17, 08:29 PM
Re: درس إنشاء خرائط الصور - بواسطة Dr.Desmond - 2007-12-21, 12:44 AM
Re: درس إنشاء خرائط الصور - بواسطة MR.A_H_M_E_D - 2008-07-23, 01:51 PM
RE: درس إنشاء خرائط الصور - بواسطة Dr.Desmond - 2009-08-15, 06:38 PM

التنقل السريع :


يقوم بقرائة الموضوع: بالاضافة الى ( 1 ) ضيف كريم