◆鼠标移动时提示的代码
以下是一个鼠标移动后提示的代码,现在我需在提示的文字信息里面,增多一张图片.
请问要如何修改程序,谢谢...
<html> <head> <title> 层与按钮对齐 </title> </head> <body>
<div align=left> <table border=1 width=600 height=50>
<tr align=center>
<td>
<input type=button value=ok onmouseover= "cc(this) " alt= "提示信息一aaaaaaaaaaaaaaaa "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this) " alt= "提示信息二 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this) " alt= "提示信息三 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> </tr>
</table> <div>
<div id=pop style= "
position: absolute;
display: none;
width:300px;
height:200px;
PADDING-TOP: 6px;
PADDING-LEFT: 6px;
PADDING-RIGHT: 6px;
PADDING-BOTTOM: 6px;
BORDER-top: #cccccc 1px solid;
BORDER-LEFT: #cccccc 1px solid;
BORDER-RIGHT: #cccccc 1px solid;
BORDER-bottom: #cccccc 1px solid;
BACKGROUND-COLOR: #ffffff;
TEXT-ALIGN: center; "
>
</div>
<script language=javascript>
function cc(tt)
{
var e = document.getElementById( "pop ");
var t = tt.offsetTop; //TT控件的定位点高
var h = tt.clientHeight; //TT控件本身的高
var l = tt.offsetLeft; //TT控件的定位点宽
var ttyp = tt.type; //TT控件的类型
while (tt = tt.offsetParent){t += tt.offsetTop; l += tt.offsetLeft;}
e.style.top = (ttyp== "image ")? t + h : t + h + 6; //层的 Y 坐标
e.style.left = l + 1; //层的 X 坐标
e.style.display = "block "; //层显示
e.innerText = window.event.srcElement.alt;
}
</script>
</body> </html>
[解决办法]
e.inner.html= " <img src= ' '> </img> "
[解决办法]
当显示 "提示信息一 "的时候也出来 "图片一 ", "提示信息二 "的时候就出来 "图片二 ":
(imgsrc1,imgsrc2,imgsrc3为图片路径)
<html> <head> <title> 层与按钮对齐 </title> </head> <body>
<div align=left> <table border=1 width=600 height=50>
<tr align=center>
<td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc1 ') " alt= "提示信息一aaaaaaaaaaaaaaaa "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc2 ') " alt= "提示信息二 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc3 ') " alt= "提示信息三 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> </tr>
</table> <div>
<div id=pop style= "
position: absolute;
display: none;
width:300px;
height:200px;
PADDING-TOP: 6px;
PADDING-LEFT: 6px;
PADDING-RIGHT: 6px;
PADDING-BOTTOM: 6px;
BORDER-top: #cccccc 1px solid;
BORDER-LEFT: #cccccc 1px solid;
BORDER-RIGHT: #cccccc 1px solid;
BORDER-bottom: #cccccc 1px solid;
BACKGROUND-COLOR: #ffffff;
TEXT-ALIGN: center; "
>
</div>
<script language=javascript>
function cc(tt,src)
{
var e = document.getElementById( "pop ");
var t = tt.offsetTop; //TT控件的定位点高
var h = tt.clientHeight; //TT控件本身的高
var l = tt.offsetLeft; //TT控件的定位点宽
var ttyp = tt.type; //TT控件的类型
while (tt = tt.offsetParent){t += tt.offsetTop; l += tt.offsetLeft;}
e.style.top = (ttyp== "image ")? t + h : t + h + 6; //层的 Y 坐标
e.style.left = l + 1; //层的 X 坐标
e.style.display = "block "; //层显示
e.innerText = window.event.srcElement.alt+ " <br/> <img src= ' "+src+ " ' /> ";
}
</script>
</body> </html>
[解决办法]
<html> <head> <title> 层与按钮对齐 </title> </head> <body>
<div align=left> <table border=1 width=600 height=50>
<tr align=center>
<td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc1 ') " alt= "提示信息一aaaaaaaaaaaaaaaa "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc2 ') " alt= "提示信息二 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> <td>
<input type=button value=ok onmouseover= "cc(this, 'imgsrc3 ') " alt= "提示信息三 "
onmouseout= "document.all.pop.style.display= 'none ' ">
</td> </tr>
</table> <div>
<div id=pop style= "
position: absolute;
display: none;
width:300px;
height:200px;
PADDING-TOP: 6px;
PADDING-LEFT: 6px;
PADDING-RIGHT: 6px;
PADDING-BOTTOM: 6px;
BORDER-top: #cccccc 1px solid;
BORDER-LEFT: #cccccc 1px solid;
BORDER-RIGHT: #cccccc 1px solid;
BORDER-bottom: #cccccc 1px solid;
BACKGROUND-COLOR: #ffffff;
TEXT-ALIGN: center; "
>
</div>
<script language=javascript>
function cc(tt)
{
var e = document.getElementById( "pop ");
var t = tt.offsetTop; //TT控件的定位点高
var h = tt.clientHeight; //TT控件本身的高
var l = tt.offsetLeft; //TT控件的定位点宽
var ttyp = tt.type; //TT控件的类型
while (tt = tt.offsetParent){t += tt.offsetTop; l += tt.offsetLeft;}
e.style.top = (ttyp== "image ")? t + h : t + h + 6; //层的 Y 坐标
e.style.left = l + 1; //层的 X 坐标
e.style.display = "block "; //层显示
var str=window.event.srcElement.alt;
str+= " <br /> <img src= ' ' /> ";
e.innerHTML=str;
}
</script>
</body> </html>
不是可以吗?
