<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery冒泡显示图标特效_网页模板</title>
<link rel="stylesheet" href="css/reset.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript" src="http://aext.net/example/bubbleup/jquery.bubbleup.js"></script>
<script type="text/javascript">
$(function(){
$("div#demo ul#menu li img").bubbleup({tooltip: true, scale:96});
});
</script>
</head>
<body>
<style type="text/css">
<!--
div#demo {
margin: 50px auto 50px auto;
text-align: center;
}
div#demo ul#menu {
margin: 5px 0px;
list-style: none;
display: inline-block;
}
div#demo ul#menu li {
padding: 0px;
float: left;
position: relative;
margin-left: 5px;
margin-right: 5px;
width: 48px;
height: 48px;
}
div#demo ul#menu li a {
position: absolute;
}
div#demo ul#menu li img {
position: absolute;
width: 48px;
top: 0px;
left: 0px;
padding: 0px;
margin: 0 8px 0 0;
border: none;
overflow: hidden;
}
-->
</style>
<div id="demo">
<ul id="menu">
<li> <a href="http://www.sharejs.com"><img src="css/images/feed.png" alt="Full RSS Feed"/></a> </li>
<li> <a href="http://feedburner.google.com/fb/a/mailverify?uri=aextnet&loc=en_U"> <img src="css/images/email.png" alt="E-Mail Delivery"/></a> </li>
<li> <a href="http://twitter.com/aextnet"> <img src="css/images/twitter.png" alt="Follow us on Twitter"/></a> </li>
<li> <a href="http://facebook.com/aextnet"> <img src="css/images/facebook.png" alt="I'm on FaceBook"/></a> </li>
<li> <a href="http://delicious.com/save" onClick="window.open('http://delicious.com/save?v=5&noui&jump=close&url=http://aext.net&title=AEXT.NET', 'delicious','toolbar=no,width=550,height=550'); return false;"> <img src="css/images/delicious.png" alt="Save it!"/></a> </li>
<li> <a href="http://technorati.com/faves?sub=addfavbtn&add=http://aext.net"> <img src="css/images/technorati.png" alt="Favorite this blog"/></a> </li>
</ul>
</div>
<div style="clear: both;"></div>
<div style="text-align:center;clear:both">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p>
<p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>
jQuery冒泡显示图标特效.zip （10个子文件） 
jQuery冒泡显示图标特效 jiaoben106 css images 
delicious.png 5KB twitter.png 9KB facebook.png 8KB email.png 7KB technorati.png 13KB feed.png 9KB
reset.css 648B jquery.bubbleup.js 2KB
index.html 2KB
jQuery冒泡显示图标特效.jpg 10KB资源评论
