javascript - 将文本超链接翻转为图像

Question

我该怎么做？

是否可以有一个文本超链接，一旦将其悬停，该文本链接就会变成图像？

iv 见过图像翻转，但还没有见过或不知道如何将文本编码为图像翻转。

我只是不知道从哪里开始以及使用什么编程语言。 javascript？ PHP？ jquery？

我开始使用以下代码:

<a href = "#" onmouseover = "(document.img.src)='SAM_2251.jpg';">Mouseover here</a>

<img name = "img" alt = "" border = "0" />

但它的作用是在图像加载到其下方时将文本保留在屏幕上。我希望文字完全摆脱图像。

有帮助的人吗？非常感谢。

Answer 1

您可以只使用 html 和 css 背景图片来完成:

html

<a href = "#" class="hover_image">Mouseover here</a>

CSS

a.hover_image:hover {
    background: url(/url/to/image) no-repeat center center;
    text-indent: -9999em;
}

您可能需要更多的 css 来定义 a 标签的宽度和高度，但这是基础。