الصورة لرسم الخرائط مع المغلق

الصورة لرسم الخرائط -- هذا البرنامج التعليمي سوف تظهر لك فوائد الخرائط والصور لماذا يجب عليك تنفيذه عند بناء المواقع. وسوف تتخذ لكم من خلال لماذا وكيف ، بالاضافة الى وضع خرائط تظهر لك الصورة في العمل. هذا التعيين صورة تعليمي يهدف الى مبتدئين فقط ، وسوف يطلب منك أن تعرف أساسيات هتمل والمغلق.

لرؤية الصورة في رسم الخرائط تجريبي فوق العمل هنا

لماذا استخدام خريطة صورة؟

النظر في الصورة التالية. تلاحظ أنه في حقيقة الأمر 2 الصور التي تم وضعها في نفس الملف. ويمكن تحقيق ذلك باستخدام برامج التصوير معظم جيدة مثل فوتوشوب.

هناك نوعان من الفوائد الرئيسية لرسم صورة. الأولى هي رمز نظافة ، وهو أمر جميع مصممي الويب ينبغي أن تطمح إلى تحقيق ، والثاني هو تعيينات صورة قدرة فريدة للتغلب على القضايا التي تثيرها الدول زر.

عند استخدام الصور المتغيرة ، ستحتاج الى تحميل أكثر من مجرد 1 صورة ، وسوف تحتاج أيضا إلى عرض هذه الصورة عندما تتغير حالة ، مما يعني أن المتصفح الخاص بك سوف تحتاج إلى تقديم الصورة الثانية وتحميلها ، وبالتالي فإن الانتقال لن يكون سلسا و المرة الاولى التي يتم عرضها. باستخدام مخطط صورة توقف عن هذه المشكلة تماما ، لانه عندما تكون الصورة الأصلية حتى يتم تحميلها هي ثاني. لا يوجد أي تأخير ، هو بهذه البساطة.

كيفية استخدام صورة خريطة

دعونا نعتبر أن أريد أن ترغب في استخدام الرمز أعلاه باعتبارها الصورة المتغيرة. هذا سوف يكون دولتين : الرمادي عندما تكون الصفحة في البداية الأحمال ، ثم اللون عند مرور المستخدم أكثر من ذلك. لذلك فإننا سوف تحتاج إلى استخدام بعض المغلق بسيطة التصميم ، رمز نريد أن ننظر بشيء من هذا القبيل.

body{
font-size: 12pt;
font-family: Arial;
}
#links {
padding:10px;
}
a.bookmark {
background: url('/images/delicious.gif') left no-repeat;
background-position: 0px -17px;
text-decoration: none;
pointer:cursor;
padding-left: 18px;
margin-left:5px;
}
a.bookmark:hover {
background: url('images/delicious.gif') left no-repeat;
background-position: 0px 1px;
text-decoration: none;
padding-left: 18px;
margin-left:5px;
pointer:cursor;
}


وكما ترون في الصورة نفسها هي التي يجري تطبيقها على كل من الدول على غرار ، وكل ما نفعله لتغيير الدولة هو تعديل خلفية موقف ، وذلك عند مرور المستخدم عبر الارتباط التغييرات الدولة ، ولكن كل هذا في الواقع هو تغيير موقف خلفية الصورة على الصفحة. الجمال الحقيقي لهذا هو كمية صغيرة من أتش تي أم أل الفعلية التي تحتاجها على الصفحة ، مرة واحدة كنت قد فعلت ذلك. لدينا على سبيل المثال أتش تي أم أل الفعلية يشبه هذا.

< a class = "bookmark" href = "#" >Delicious</ a >


هذا كل ما في الامر. فقط مع كمية صغيرة من المغلق ، بل وحتى أصغر كمية أتش تي أم أل ، نستطيع إيجاد طريقة سريعة جدا وقوية لالصور المتغيرة. لمشاهدة العرض التوضيحي في العمل انقر هنا.