基于jquery1.4.2的仿flash超炫焦点图播放效果

好嘞！废话不多说！Code贴上！哪位高手有更好的方式可以多多指点！
CSS Code

/*
* images player
* author:mr·zhong
* date:2010-04-19
*/
#playerBox{
width:305px;
height:282px;
border:1px solid #ccc;
}
#playerImage ul{
padding:0px;
margin:0px;
border:0px;
list-style:none;
position:absolute;
}
#playerImage ul li{
padding:0px;
margin:0px;
border:0px;
list-style:none;
position:absolute;
}
#playerImage li img{
width:305px;
height:282px;
border:0px;
}
#playerNavAndTitle{
z-index:10;
position:absolute;
height:50px;
width:305px;
background-color:#000;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
#playerNavAndTitle #playerTitle{
width:auto;
height:20px;
line-height:30px;
text-indent:10px;
}
#playerNavAndTitle #playerTitle a{
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
position:absolute;
font-size:15px;
font-family:宋体;
}
#playerNavAndTitle #playerTitle a:hover
{
color:Yellow;
}
#playerNavAndTitle #playerNav{
float:right;
text-align:right;
}
#playerNavAndTitle #playerNav a{
float:left;
display:block;
background-color:#CC3300;
border:1px solid #fff;
width:15px;
height:15px;
margin:5px 5px;
text-align:center;
line-height:15px;
text-decoration:none;
color:#FFFFFF;
cursor:pointer;
font-family:宋体;
}
#playerNavAndTitle #playerNav .hover{
background-color:#FFFFFF;
border:1px solid #cc3300;
color:#CC3300;
float:left;
display:block;
width:15px;
height:15px;
margin:5px 5px;
text-align:center;
line-height:15px;
text-decoration:none;
cursor:pointer;
font-family:宋体;
}

HTML Code

<div id=”playerBox”>
<div id=”playerImage”>
<ul>
<li><img src=”img/1.gif” /></li>
<li><img src=”img/2.gif” /></li>
<li><img src=”img/3.gif” /></li>
<li><img src=”img/4.gif” /></li>
<li><img src=”img/5.gif” /></li>
</ul>
</div>
<div id=”playerNavAndTitle”>
<div id=”playerTitle”>
<a href=”#”>测试一</a>
<a href=”#”>测试二</a>
<a href=”#”>测试三</a>
<a href=”#”>测试四</a>
<a href=”#”>测试五</a>
</div>
<div id=”playerNav”></div>
</div>
</div>

JS Code

/*
* images player
* author:mr·zhong
* date:2010-04-19
*/
//当前导航页码数字
var currentPage = 1;