<html>
<script src="http://lgytraining.com.au/js/jquery-1.8.2.js"></script>
<script>
//导航
$(function () {
$('#nav li a').hover(function () {
var w = $(this).width();
$(this).children('i').css({ 'width': w });
$(this).children('i').stop().animate({ 'top': 0 },300);
}, function () {
$(this).children('i').stop().animate({ 'top': -65 },200);
})
})
</script>
<style>
#header #nav {
height: 65px;
overflow: hidden;
}
#header #nav li {
float: left;
margin-left: 1px;
}
#header #nav li a {
color: #FFFFFF;
display: block;
font-size: 16px;
height: 65px;
text-decoration: none;
padding: 0 18px;
position: relative;
}
#header #nav li a i {
background: none repeat scroll 0 0 #448808;
height: 65px;
left: 0;
padding: 0 18px;
position: absolute;
top: -65px;
}
#header #nav li a b {
font-weight: normal;
line-height: 90px;
position: relative;
z-index: 2;
}
#header #nav li a.current {
background: none repeat scroll 0 0 #448808;
}
#header #nav li a i {
background: none repeat scroll 0 0 #448808;
height: 65px;
left: 0;
padding: 0 18px;
position: absolute;
top: -65px;
}
</style>
<body bgcolor='black'>
<div id="header" >
<ul id="nav" class="fr">
<li><a href="Default.aspx"><i style="width: 32px; top: -65px;"></i><b>首页</b></a></li>
<li><a href="about.aspx"><i style="width: 64px; top: -65px;"></i><b>关于立恒</b></a></li>
<li><a href="course.aspx"><i style="width: 64px; top: -65px;"></i><b>课程介绍</b></a></li>
<li><a href="share.aspx"><i style="width: 64px; top: -65px;"></i><b>成功分享</b></a></li>
<li><a href="service.aspx"><i style="width: 64px; top: -65px;"></i><b>项目服务</b></a></li>
<li><a href="online.aspx"><i style="width: 64px; top: -65px;"></i><b>在线报名</b></a></li>
<li><a href="contact.aspx"><i style="width: 64px; top: -65px;"></i><b>联系我们</b></a></li>
<li><a href="http://lgyaccountant.com.au/bbs/forum.php"><i style="width: 32px; top: -65px;"></i><b>论坛</b></a></li>
</ul>
</div>
</body>
</html>
