0

我有一堆翻转，当你翻转它们时，它们会在子弹上方显示数字。我希望数字在 onmouseout 上消失，但在下一次 onmousedown 之前一直保持在 onmousedown 上。有没有比给每个号码自己的 id 并打开和关闭它更简单的方法？我希望这是有道理的？！？12

谢谢！

CSS

#numbers1, #numbers2, #numbers3, #numbers4 {
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
color: #6e6965;
margin: -10px 0 0 2px;
position: absolute;
display:none;
}

HTML

<span onmouseover="document.rollimg.src=image1.src; document.getElementById('numbers1').style.display = 'inline';">
<a class="bullet"><div id="numbers1">1</div></a></span>

<span onmouseover="document.rollimg.src=image2.src; document.getElementById('numbers2').style.display = 'inline';" 
<a class="bullet"><div id="numbers2">2</div></a></span>

<span onmouseover="document.rollimg.src=image3.src; document.getElementById('numbers3').style.display = 'inline';" 
<a class="bullet"><div id="numbers3">3</div></a></span>

<span onmouseover="document.rollimg.src=image4.src; document.getElementById('numbers4').style.display = 'inline';" 
<a class="bullet"><div id="numbers4">4</div></a></span>
4

1 回答 1

0

您可以使用 CSS 来做到这一点，:hover而且:focus- 不需要 JavaScript。

a div {
    display:none;
}

a:hover div, a:focus div {
    display: block;
}

a:focus {
    outline: none;
}

为了使:focus选择器正常工作，您还需要tabindex在每个a元素上添加一个；我建议tabindex="-1"（这是一个 HTML 属性）。当然，您还需要将其限制为特定a元素，而不是页面上的所有链接。

jsFiddle：http: //jsfiddle.net/c4yq5/

jsFiddle 基于来自问题的代码：http: //jsfiddle.net/FpSgW/1/

于 2012-07-02T22:25:46.127 回答