Вопрос

У меня есть это:

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

Проблема заключается в том, что мыши снова u003Cspan>запускают мышь с мгновенной мышиной и мышкой, даже если между ними нет прокладки или края. Даже в строке состояния браузера ссылка мерцает на мгновение. Как это можно предотвратить?u003C/span>

Это было полезно?

Решение 6

Взломал мой путь к решению. Положение: Относительно якорь и фиктивный див внутри, который расширяется при ширине и высоте 100%, абсолютно позиционируется, чтобы точно наложить якорь. Больше не мешает ссылке на зависание и не должно быть никаких фиктивных событий Mouseout. Вот код и Вот ссылка :

<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, поместите обработчик Onclick на 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