写了个jQuery无缝滚动小插件

一个项目中需要用到图片无缝滚动，拿出几年前用过的一用结果不能用了，网上一顿搜索结果没找到太好用的，要不就是要写很多html和js，要不就是对滚动的内容有严格的要求，只好参考着改善了一下，没有做太详细的测试，不过在自己的项目里使用没有什么问题，记下来以备后用，有什么新的需要再扩展吧。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="Js/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(function()
{
    $("#imageMarquee").marquee();
});

(function($) {
    $.fn.marquee = function(o) {
        o = $.extend({
            speed:        parseInt($(this).attr('speed')) || 30, // 滚动速度
            step:        parseInt($(this).attr('step')) || 1, // 滚动步长
            direction:    $(this).attr('direction') || 'left' // 滚动方向
        }, o || {});
        var dIndex = jQuery.inArray(o.direction, ['right', 'down']);
        if (dIndex > -1) {
            o.direction = ['left', 'up'][dIndex];
            o.step = -o.step;
        }
        var mid;
        var e = $(this);
        e.wrap("<div class='wrap'><ul><li></li></ul></div>");
        var p = e.parent().parent().parent();
        //alert(e.width());
        p.find('ul>li:first').after(p.find('ul>li:first').clone());
        p.find('ul:first').css("listStyle","none");
        if(o.direction == 'left')
        {
            p.find('ul>li').css("float","left");
            p.find('ul:first').width(e.width() * 2);
        }
        else
        {
            p.find('ul:first').height(e.height() * 2);
        }
        mid = setInterval(_marquee, o.speed);
        p.hover(
            function(){clearInterval(mid);},
            function(){mid = setInterval(_marquee, o.speed);}
        );
        function _marquee() {
            if (o.direction == 'left') {
                if(p.scrollLeft() >= e.width()){
                    p.scrollLeft(0);
                }
                else{
                    p.scrollLeft(p.scrollLeft() + o.step);
                }
            }
            else{
                if(p.scrollTop() >= e.height()){
                    p.scrollTop(0);
                }
                else{
                    p.scrollTop(p.scrollTop() + o.step);
                }
            }
        }
    };
})(jQuery);
</script>
<style type="text/css">
.wrap{ width:800px; height:180px; overflow:hidden;}
#imageMarquee td { padding:5px; }
#imageMarquee img {border:solid 1px #999999;}
</style>
</head>

<body>
<table width="500" border="0" cellspacing="0" cellpadding="0" id="imageMarquee">
  <tr>
    <td><img src="Images/1.jpg" width="145" height="160" /></td>
    <td><img src="Images/2.jpg" width="145" height="160" /></td>
    <td><img src="Images/3.jpg" width="145" height="160" /></td>
    <td><img src="Images/4.jpg" width="145" height="160" /></td>
    <td><img src="Images/5.jpg" width="145" height="160" /></td>
  </tr>
</table>
</body>
</html>