سؤال

لدي هذا:

<a href="javascript:void(0);">
   <div>
      <span>some content</span>
      <span>some content</span>
   </div>
</a>

تكمن المشكلة في تحوم الماوس من واحد u003Cspan>إلى آخر يؤدي إلى فأرة فورية وفأرة مرة أخرى على الرغم من أنه ليس لديهم حشوة أو هامش بينهما. حتى في شريط حالة المتصفح ، وميض الرابط للحظة. كيف يمكن لهذا أن يمنع؟u003C/span>

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

المحلول 6

اخترق طريقي إلى حل. الموضع: النسبية المرساة و div وهمية داخل التي تتوسع في العرض والارتفاع 100 ٪ في وضع تماما لتراكب المرساة بالضبط. لم يعد وميض الرابط على التحويم ولا ينبغي أن يكون أي أحداث ماوس دمية تطلق النار. هنا هو الرمز و هنا رابط :

<html><head><style>
a {
float:left;
border:1px solid #b0b;
display:block;
position:relative;
}
.shpf,.shpe {
background:#b0b; float:left;
width:2px; height:2px;
padding:0; margin:0;
line-height:0;
}
.shpe {
background:#fff;
}
.shpbrk {
float:left; clear:both;
}
.dummy {
z-index:1;
position:absolute;
left:-1px; top:-1px; /* Fix for parent's border, isn't required for no border */
border:1px solid;
border-color:inherit;
background:transparent;
width:100%;
height:100%;
}
</style></head><body>
<a id="happy" href="javascript:void(0);"><div class="dummy"></div><div id="happy_button" class="button"><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpf"></span><span class="shpf"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span></div></a>
</body></html>

نصائح أخرى

لأي شخص يصادف هذا المنشور كأرشيف ، إليك ما نجح لي بدلاً من ذلك.

بدلاً من استخدام mouseout () حاول استخدام mouseLeave () للعلامة.

كانت مشكلتي نتيجة لعناصر داخل DIV تؤدي إلى العديد من مكالمات الفأر. MouseLeave على الكائن الأصل حل هذا.

إذا كنت تستخدم jQuery ، فيجب عليك التبديل إلى hover طريقة.

خلاف ذلك ، تحقق e.target || e.srcElement.

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

إذا كنت تحاول إجراء شيء ما عند النقر فوق Div ، فضع معالجًا على Div.

حسنًا ، لديك فجوة رأسية (أستطيع أن أرى خلاصة خط بين الاثنين <span> العلامات). أزلها.

تجدر الإشارة أيضًا إلى أن HTML الخاص بك بعيدًا عن الصالح. عناصر مضمنة مثل <a> لا يمكن أن تحتوي على عناصر كتلة مثل <div>.

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

<html><head><style>
a {
float:left;
border:1px solid #b0b;
display:block;
}
.shpf,.shpe {
background:#b0b; float:left;
width:2px; height:2px;
padding:0; margin:0;
line-height:0;
}
.shpe {
background:#fff;
}
.shpbrk {
float:left; clear:both;
}
</style></head><body>
<a id="happy" href="javascript:void(0);"><div id="happy_button" class="button"><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpf"></span><span class="shpf"></span><span class="shpf"></span><span class="shpf"></span><span class="shpe"></span><span class="shpe"></span><span class="shpbrk"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span><span class="shpe"></span></div></a>
</body></html>

ملاحظة: حتى باستخدامu003C!doctype html> الذي يسمح للمراسي أن يكون عناصر حظر كما أشار Ricebowl إلى أن النتيجة هي نفسها. يؤدي التحوم فوق المرساة إلى تشغيل أحداث الفأر ويجعل أيضًا شريط الحالة لتومض نص رابط الوجهة (على الأقل في Firefox ، لم يختبر مكانًا آخر). الفترات فارغة وهي خطأ عادة ولكن يحدث نفس الشيء حتى داخلها.

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