不会的要多查多问，不然不会的永远不会，哪怕你离会就差了那么一点点
一个简单的jQuery信息提示效果
[
2013/05/18 23:23 | by 刘新修 ]
2013/05/18 23:23 | by 刘新修 ]
jQuery信息提示(jQuery Tooltip)效果可以很好的提升用户体验，在web developer中也经日趋频繁，下面是一个简单的jQuery息提示效果实例演示。
首先加载jQuery库文件：
JavaScript代码
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
下面是jQuery核心代码：
JavaScript代码
- $(document).ready(function () {
- $(".menu a").hover(function () {
- $(this).next("em").animate({
- opacity: "show",
- top: "-75"
- }, "slow");
- }, function () {
- $(this).next("em").animate({
- opacity: "hide",
- top: "-85"
- }, "fast");
- });
- });
HTML代码如下：
XML/HTML代码
- <ul>
- <li><a href="#">…</a><em style="top: -85px; display: none;">…</em></li>
- <li><a href="#">…</a><em style="top: -85px; display: none;">…</em></li>
- <li><a href="#">…</a><em style="top: -85px; display: none;">…</em></li>
- </ul>
