简单的鼠标放上显示提示内容-弹出层

2012年4月2日 发表评论 阅读评论

<script>
function showdetail(w){
if (w=="")return;
var x=event.x;
var y=event.y;
showpostdetail.innerHTML=document.getElementById(w).innerHTML + "<br>";
showpostdetail.style.visibility="visible";
showpostdetail.style.display="block";
showpostdetail.style.left=x+10;
showpostdetail.style.pixelTop=y+document.documentElement.scrollTop+10;

}
function hidedetail(){
showpostdetail.style.innerHTML=""
showpostdetail.style.visibility="hidden";
showpostdetail.style.display="None";
}
document.write("<div id=’showpostdetail’ class=’dv’></div>");
</script>
<style>
/*弹出层样式*/
.dv{
position:absolute;
width:300px;
z-index:1;
background-color: #FFFFE1;
border: 1px solid #000000;
overflow: visible;
visibility: hidden;
font-size:12px;
padding:12px;
color:#000000;
line-height: 18px;
}
</style>

<div id=’s0′ class="dv">I am hello1 </div>
<div id=’s1′ class="dv">I am hello2 </div>

<a href="#" class="c1" onmousemove=’showdetail("s0")’ onmouseout=’hidedetail

()’>hello1</a><p/>
<a href="#" class="c1" onmousemove=’showdetail("s1")’ onmouseout=’hidedetail()’>hello2</a>


转载请注明来自:[MSN Spaces]http://msn.shandian.biz/249.html

  1. 本文目前尚无任何评论.