سؤال

وأنا في حاجة الى القليل من التوجيه هنا ...

ولقد 2 الروابط:

<div class="tarjBodyHolder">
    <div class="imageHolder">
        <a href="#" onclick="alert('picture link'); return false;">
           <img border="0" src="/picture.jpg" />
        </a>
    </div>
    <div class="linkTransp">
       <a href="#" onclick="alert('family link'); return false;">RAM Moudles</a>
    </div>
</div>

والمغلق:

.tarjBodyHolder{
    position: relative; 
    clear: both; 
    height: 152px;
 }

.tarjBodyHolder .linkTransp{
     position: absolute; 
     bottom: 0px; 
     left: 0px; 
     width: 120px;
     height: 15px;
     z-index: 6; /*IE bug*/
}
.tarjBodyHolder .linkTransp a {
     display: block;
     text-indent: -9999px; 
     width: 120px; 
     height: 15px;
     overflow: hidden;
     z-index: 6;
 }
 .tarjBodyHolder .imageHolder{
     position: absolute; 
     bottom: 0px; 
     left: 0px;/*IE 7 bug*/
 }

وهذا هو القادم:

والارتباط IMG هو صورة من عنصر. وتمت طباعة هذه الصورة على أنها فئة حيث تنتمي هذه البنود. على سبيل المثال: DDR RAM وحدة لديه صورة وسلسلة "<< RAM MODULES" المطبوعة على ذلك. فكرة من هذا هو أنه عند النقر فوق هذه السلسلة هذا يأخذك إلى هذه الفئة من هذا البند ويمكنك ان ترى كل المنتجات الواردة فيه. ولكن إذا قمت بالنقر فوق صورة للمنتج وسوف ينتهي في صفحة وصف المنتج. ما احتاج اليه هو ما يلي:

والتداخل و"غير مرئية" (*) الفئة صلة ورابط الصورة. هذا هو السبب في أنني قد استخدمت الموقف: مطلقة؛ على فايرفوكس هو عظيم حقا .. لكنني غير قادر على معرفة كيفية القيام بذلك على IE6 / 7. لا يهم ما أقوم به أنها لا تعمل مع النص في الهامش: -9999px .. إذا أعلق هذا النص تصبح مرئية و استطيع ان اضغط عليه .. ولكن لا يمكن ذلك. لقد حاولت حتى الإعلان عن العرض والارتفاع و!!

و(*) وأقول "غير مرئية" لهذا الرابط يجب أن يكون النص .. ولكن يجب أن لا يكون قادرا على رؤية ذلك لأنه -9999px بادئة.

هل كانت مفيدة؟

المحلول

ويبدو لي ان كنت تريد والقديمة الطراز صورة الخريطة. تداخل العناصر مرتبطة مثل هذا نادرا ما يكون فكرة جيدة.

وما أسمعه هو أن لديك صورة. جزء من الصورة (الجزء الموافقة المسبقة عن علم) وصلات إلى صفحة الوصف. أما الجزء الآخر (الجزء النص) يربط إلى عنوان آخر من الفئات.

وإما العيش مع 1 الصورة أعلاه وارتباط النص أدناه، أو استخدام <خريطة> العلامة لتقسيم الصورة.

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

http://www.w3schools.com/TAGS/tag_map.asp

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top