发一个模仿QQ用户信息提示的JS效果,请大家多提意见^_^
一个模仿QQ的好友信息显示的效果,本来也不是很难,由于本人是新手,走了不少弯路,也在这里发过询问帖子,最后还是弄出来了,在这里感谢大家的帮助^_^
我很菜,做的不是太好,请大家多提意见
完整的图片和代码可以到这里下载 http://www.114vip.com.cn/upload/down/qqpop.rar
主要的代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:9927;
left: 619px;
top: 215px;
background-color: #999999;
}
-->
</style>
</head>
<body>
<script language="javascript">
var txqqpop_timer=0;
function txqqpop_getObjX(temp_obj)
{
var temp_i=temp_obj.offsetLeft;
while (temp_obj=temp_obj.offsetParent)
{
temp_i+=temp_obj.offsetLeft;
}
return temp_i;
}
function txqqpop_getObjY(temp_obj)
{
var temp_i=temp_obj.offsetTop;
while (temp_obj=temp_obj.offsetParent)
{
temp_i+=temp_obj.offsetTop;
}
return temp_i;
}
function txqqpop_show(qqpop_username,temp_obj,qqpop_type,move_x,move_y)
{
// 欢迎访问www.114vip.com.cn
// 有什么问题可以联系我 QQ:511795070
var temp_popdiv=document.getElementById("tx_txqqpop_div");
if (txqqpop_timer!=0)
{
clearTimeout(txqqpop_timer);
txqqpop_timer=0;
}
if (temp_popdiv.style.display!="none") {return ;}
var temp_obj_x=txqqpop_getObjX(temp_obj);
var temp_obj_y=txqqpop_getObjY(temp_obj);
if (qqpop_type=="right")
{
temp_popdiv.style.left=temp_obj_x + parseInt(temp_obj.offsetWidth) + move_x;
temp_popdiv.style.top =temp_obj_y + move_y;
}
else
{
temp_popdiv.style.left=temp_obj_x + move_x;
temp_popdiv.style.top =temp_obj_y + parseInt(temp_obj.offsetHeight) + move_y;
}
temp_popdiv.style.display="";
}
function txqqpop_hide()
{
txqqpop_timer=setTimeout("txqqpop_hideme()",400);
}
function txqqpop_hideme()
{
var temp_popdiv=document.getElementById("tx_txqqpop_div");
temp_popdiv.style.display="none";
if (txqqpop_timer!=0)
{
clearTimeout(txqqpop_timer);
txqqpop_timer=0;
}
}
function txqqpop_keepshow()
{
if (txqqpop_timer!=0)
{
clearTimeout(txqqpop_timer);
txqqpop_timer=0;
}
var temp_popdiv=document.getElementById("tx_txqqpop_div");
if (temp_popdiv.style.display=="none") {temp_popdiv.style.display="";}
}
</script>
<div style="position:absolute;border:1px solid #3669A3;z-index:9986;width:282px;height:205px;display:none" id="tx_txqqpop_div" onmouseout="txqqpop_hide();" onmouseover="txqqpop_keepshow();">
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#d2e5f4" id="tx_txqqpop_table" background="qy_images/qqpopbg_9.jpg">
<tr>
&nb