写个div,就是说的提示框。把定位设置为fixed。一开始把他的display设置为none。根据点击的元素的坐标设置提示框的top、left或者right、bottom
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
<head>
<title>jQuery事件处理—显示文字气球</title>
<script type="text/javascript" src="rs/js/jquery.js"></script>
<script type="text/javascript">
<!--
$(
function()
{
$('.buttons').hover(
function(event)
{
$(this).addClass('hover')
var txt = $(this).text()
$('<span class="show">THIS IS ' +
txt + ' MENU </span>').appendTo($(this))
},
function()
{
$(this).removeClass('hover')
$('.show').remove()
}
)
}
)
//-->
</script>
<style type="text/css">
.buttons{
width:150px
float: left
text-align: center
color:#000
margin: 5px
border: 2px solid
font-weight: bold
cursor: hand
}
.hover{
color:red
background-image: url("rs/images/boll.gif")
background-repeat:repeat-y
background-position: bottom
}
.show{
display: block
margin: 15px
}
</style>
</head>
<body>
<span id="ib" class="buttons">BOLD</span>
<span id="ii" class="buttons">ITALIC</span>
</html>
你试试
