在MouseOver上为html格式的图像显示文本
在MouseOver上为html格式的图像显示文本
提问于 2012-08-24 15:49:06
我想在用户将鼠标移到图像上时显示文本。
我如何在HTML/JS中做到这一点？
回答 3
Stack Overflow用户
发布于 2012-08-24 15:52:16
您可以使用CSS悬停
在这里链接到jsfiddle：http://jsfiddle.net/ANKwQ/5/
HTML：
<a><img src='https://encrypted-tbn2.google.com/images?q=tbn:ANd9GcQB3a3aouZcIPEF0di4r9uK4c0r9FlFnCasg_P8ISk8tZytippZRQ'></a>
<div>text</div>
CSS：
div {
display: none;
border:1px solid #000;
height:30px;
width:290px;
margin-left:10px;
}
a:hover + div {
display: block;
}Stack Overflow用户
发布于 2012-12-18 18:39:20
您也可以这样做：
HTML：
<a><img src='https://encrypted-tbn2.google.com/images?q=tbn:ANd9GcQB3a3aouZcIPEF0di4r9uK4c0r9FlFnCasg_P8ISk8tZytippZRQ' onmouseover="somefunction();"></a>在javascript中：
function somefunction()
{
//Do somethisg.
}
Stack Overflow用户
发布于 2012-08-24 15:57:23
您可以将CSS悬停与图像背景结合使用。
CSS
.image
{
background:url(images/back.png);
height:100px;
width:100px;
display: block;
float:left;
}
.image a {
display: none;
}
.image a:hover {
display: block;
}HTML
<div class="image"><a href="#">Text you want on mouseover</a></div>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12105214
复制相关文章
相似问题