jQuery笔记：网站的超链接和图片的提示效果
文章目录
- 超链接提示效果
- 版本1
- 版本2
- 版本3（最终版本）
- 图片提示效果
超链接提示效果
在现代浏览器中，超链接中加入title属性就可以实现鼠标悬停提示效果，如：
<!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=utf-8" />
<title>文字提示</title>
<!-- 引入jQuery -->
<script src="scripts/jquery.js" type="text/javascript"></script>
<style type="text/css">
body{
margin:10px;
padding:40px;
background:#fff;
font:80% Arial, Helvetica, sans-serif;
color:#555;
line-height:180%;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<p><a href="#" class="tooltip" title="这是我的超链接提示1.">提示1.</a></p>
<p><a href="#" class="tooltip" title="这是我的超链接提示2.">提示2.</a></p>
<p><a href="#" title="这是自带提示1.">自带提示1.</a></p>
<p><a href="#" title="这是自带提示2.">自带提示2.</a></p>
</body>
</html>
然而提示效果的响应速度是非常慢的，考虑到良好的人机交互，需要鼠标移动到超链接那一瞬间就出现提示。就需要移去标签中title提示效果，手动做一个类似功能的提示，我们的目标是将提示1和提示2的超链接提示效果用jQuery实现快速响应。
实现思路：
（事件一）、鼠标滑入超链接：
- 利用jQuery创建一个
