鼠标悬浮时显示对话框

====草稿 ，待完善===

叫做 ToolTip。

function imagePreview(){
$("a.preview").hover(function(e){
var t_top=this.offsetTop+20;//获取该链接的位置
var t_left=this.offsetLeft;
<?php foreach($groups as $g) { ?>
if(this.innerHTML=="<?php echo $g['name'];?>"){
<?php $user1=$this->user_model->get_user_info($g['main_uid']);$user2=$this->user_model->get_user_info($g['deputy_uid1']);$user3=$this->user_model->get_user_info($g['deputy_uid2']); ?>
$("body").append("<p id='preview' style='width:250px'><img style='float:left;margin-right:5px;' height=100px width=100px src='"+"http://"+"<?php echo $g['avatar'];?>" +"' alt='Image preview' />"+"小&nbsp;&nbsp;&nbsp;组: "+this.innerHTML+"<br/>创建者: "+"<?php echo $user1['name'];?>"+"<br/>管理员: "+"<?php echo $user2['name'];?>"+"&nbsp;"+"<?php echo $user3['name'];?>"+"<br/>帖子数: "+"<?php echo $g['all_article_number'];?>"+"<br/>成员数: "+"<?php echo $g['ccd_user_number'];?>"+"</p>");
}
<?php } ?>
/*if(e.pageX+280>1000){
$("#preview")
.css("top",(e.pageY - 10) + "px")
.css("left",(e.pageX -270) + "px")
.fadeIn("slow");
}else{
$("#preview")
//.css("top",(e.pageY - 10) + "px")
//.css("left",(e.pageX + 20) + "px")
.css("top",(e.pageY + 10) + "px")
.css("left",(e.pageX - 0) + "px")
.fadeIn("slow");
}*/
$("#preview")
.css("top",t_top)
.css("left",t_left )
.fadeIn("slow");
},
function(){
$("#preview").remove();
});
/*$("a.preview").mousemove(function(e){
if(e.pageX+280>1000){
$("#preview")
.css("top",(e.pageY - 10) + "px")
.css("left",(e.pageX -270) + "px");
}else{
$("#preview")
.css("top",(e.pageY - 10) + "px")
.css("left",(e.pageX + 20) + "px");
}
});*/
}

转载于:https://www.cnblogs.com/caroar/archive/2012/09/25/2701926.html