javascript - 图像翻转，文字出现在别处

Question

这里的这个旧页面是用 jQuery 完成的并且工作正常，但底部的文本是使用图像完成的。现在我真的希望它是真实的文本。

http://ou812.bplaced.net/rollover-with-text/

我很抱歉，因为我知道有很多类似这样的讨论，但是数小时又数小时的搜索没有帮助。我不是 Javascript 或 CSS 高手。有人能指出我正确的方向吗？示例页面？

非常感谢!

Answer 1

JSFiddle

您可以这样做(请注意，这是最低限度的):

HTML:

<div>Element 1</div>
<div>Element 2</div>
<div>Element 3</div>
<div>Element 4</div>
<div>Element 5</div>
<p></p>

JavaScript:

var div = document.getElementsByTagName('div'),
    p   = document.getElementsByTagName('p')[0];

for(i = 0; i < div.length; i++)
{
    div[i].onmouseover = function(){
        p.innerHTML = this.innerHTML;
    }
}

这不需要 jQuery，但如果你想使用它，就在这里。

JSFiddle

var div = $('div');
var p   = $('p');

$(div).hover(function(){
    $(p).html($(this).html());
});