鼠标滑过高亮显示图片

这是一个鼠标滑过高亮显示图片的代码，没有用到任何滤镜，只是用到的是fadeTo（）这个jQuery方法。
这个是jQuery代码：
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
                          $('ul.qidao li img').fadeTo('fast',0.5)
                          .parent().css({display:'block',width:'117px',height:'94px',backgroundColor:'#62693f',marginLeft:'1px',marginTop:'1px'});
                          $('ul.qidao li a').hover(function() {
                                                            $(this).children().fadeTo('fast',1);
                                                            },function() {
                                                                $(this).children().fadeTo('fast',0.5);
                                                            });
                          });
</script>


这里是相关的html代码：


<div style=" width:841px; height:389px;margin:5px auto">
        <ul class="qidao">
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-04.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-05.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-04.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-05.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-04.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-05.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-04.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-05.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-04.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-05.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-02.jpg" width="115" height="92" /></a></li>
        <li><a href="#"><img src="images/qidao-03.jpg" width="115" height="92" /></a></li>
        </ul>
   
    </div>


这里的a标签我给了一个深色的背景，然后让图片半透明，鼠标滑过的时候让图片不透明，就实现了高亮的效果。


这里我把源文件送上，需要的朋友可以下载。