0

我有一个链接，该链接调用了一个 onmouseover javascript 函数，该函数使下面的 div 可见。现在这一切都有效。

现在的问题是我有 aa href 链接，当我将鼠标悬停在它的顶部时，它工作得很好，但是当我将鼠标移到“现在可见”的 div 上方时，它会闪烁，因为 html 似乎认为它不在 div 上然后再次打开它，使其不断关闭和打开。

我怎样才能阻止这种情况发生？（下面的html，javascript是一个让它可见的简单函数，没有发布的意义，它可以工作）

<a style="text-decoration:none;display:block;" onmouseout="ShowStock(1,0);" onmouseover="ShowStock(1,1);" href="">50</a>
<div id="stock1" style="visibility: hidden;">
<a style=" background-color:#009933; text-align:center;" name="1">1</a>
</div>

它发生的视频： http ://screencast.com/t/qjxHN4wyIc

4

2 回答 2

1

您的视频中演示的问题是stock1 div正在窃取焦点，然后触发onmouseout，关闭stock1 div，然后触发A标签的onmouseover，显示stock1 div，然后窃取焦点，触发onmouseout A标签等...

最简单的做法是将相同的 ShowStock onmouseout/onmouseover 应用到 stock1 div，以便它在鼠标悬停时“显示”自身，但在未悬停时隐藏自身，除非您将鼠标悬停在 A 标签内的区域上这表明了它。

例如，这完美地工作（在jsfiddle.net上，它还演示了一个单独的版本，视频中演示了错误）：

a.hover {
    background-color: #ccc;
    width: 200px;
    height: 200px;
    position: absolute;
    top: 15px;
    left: 15px;
}
#show1 {
    display: none;
    width: 200px;
    height: 200px;
    position: absolute;
    top: 75px;
    left: 75px;
    background-color: #daa;
}

function showTarget(target, state) {
    switch (state) {
        case 1:
            state = 'block';
        break;
        default:
            state = 'none';
    }
    target = 'show'+target;
    document.getElementById(target).style.display = state;
}

<a class="hover" onmouseover="showTarget(1,1)" onmouseout="showTarget(1,0)">Test</a>
<div id="show1" onmouseover="showTarget(1,1)" onmouseout="showTarget(1,0)">Test Show</div>
于 2011-03-09T01:18:15.863 回答
1

尝试将 onmouseout 事件放在 stock outsider 元素上，就像放在具有 onmousein 事件的元素“a”上一样，并删除原始元素的 onmouseout 事件。

这样，当您将鼠标移出刚刚出现的库存元素时，它就会关闭。

于 2011-03-09T01:26:56.220 回答