最近看一些jQuery的东西，最最简单的例子了，记录下。
这个例子是用来替代浏览器自带的超链接提示效果（即a标签的title属性），可以实现随鼠标移动。
大体思路就是控制mouseover,mouseout,mousemove几个事件，完整代码如下（运行需要jQuery）：
<head>
<script src="./jquery-1.8.2.min.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function(){
$("a.tooltip").mouseover(function(e){
var tooltip="<div id='tips'>heihei</div>";
$("body").append(tooltip);
$("#tips")
.css({
"color":"red",
"margin-top":e.pageY+"px",
"margin-left":e.pageX+"px"}).show("fast");
}).mouseout(function(){
$("#tips").remove();
}).mousemove(function(e){
$("#tips")
.css({
"margin-top":(e.pageY)+"px",
"margin-left":(e.pageX)+"px"}).show("fast");
});
});
</script>
</head>
<body>
<p><a href="#" class="tooltip">提示</a></p>
</body>
<script src="./jquery-1.8.2.min.js" type="text/javascript">
</script>
<script type="text/javascript">
$(document).ready(function(){
$("a.tooltip").mouseover(function(e){
var tooltip="<div id='tips'>heihei</div>";
$("body").append(tooltip);
$("#tips")
.css({
"color":"red",
"margin-top":e.pageY+"px",
"margin-left":e.pageX+"px"}).show("fast");
}).mouseout(function(){
$("#tips").remove();
}).mousemove(function(e){
$("#tips")
.css({
"margin-top":(e.pageY)+"px",
"margin-left":(e.pageX)+"px"}).show("fast");
});
});
</script>
</head>
<body>
<p><a href="#" class="tooltip">提示</a></p>
</body>