jquery 文字滚动

工作的时候总是用到这个效果，就记录下来方便下次使用

例：

css:

*{ margin:0 ; padding:0;}
	body{ font-size:12px;}
	ul,li{ list-style:none;}
	.box{ width:200px; height:300px; position:relative; line-height:25px; overflow:hidden; margin:20px auto; border:1px solid #F60;}
	.box ul{ padding:0 10px; position:relative;}

html:

<div id="demo" class="box">
	<div id="demo1" class="boxIn">
		<ul>
			<li>1神马都是浮云神马都是浮云</li>
			<li>2神马都是浮云神马都是浮云</li>
			<li>3神马都是浮云神马都是浮云</li>
			<li>4神马都是浮云神马都是浮云</li>
			<li>5神马都是浮云神马都是浮云</li>
			<li>6神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
			<li>神马都是浮云神马都是浮云</li>
		</ul>
	</div>
	<div id="demo2"></div>
</div>

js:

<script type="text/javascript">
    <!--
        (function($){
        $.fn.scrollFont = function(o){
            var d = {
                scrollWap:'#demo',
                scrollWapIn:'#demo1',
                cloneCon:'#demo2', //
                speed:60        //滚动的间隔
            };
            var o = $.extend(d,o);
            var demo = $(d.scrollWap).scrollTop();
            var ul = $(d.scrollWapIn).height(); //获得滚动区框的高度
            var one = $(d.scrollWapIn).html(); //获得滚动区中的内容
            var demo2 = $(d.cloneCon).append(one);//克隆并添加到demo2
            var inter = setInterval(fn,d.speed);
            function fn(){
                if(demo >= 0){
                    $(d.scrollWap).scrollTop(demo++)
                }
                if(demo == ul){
                    demo = 0;    
                }
            }
        $(d.scrollWap).mouseover(function(){
            clearInterval(inter);
        });
        $(d.scrollWap).mouseout(function(){
            inter = setInterval(fn,d.speed);
        });
        }
    })(jQuery);
    $(function(){
        $.fn.scrollFont()    
    });

    //-->
</script>