滚动显示

此例子也是根据人家修改的 呵呵
公共的css

<style type="text/css">
ul,li{margin:0;padding:0}
#scrollDiv{width:800px;height:100px;line-height:25px;border:#ccc 1px solid;overflow:hidden}
#scrollDiv li{height:25px;padding-left:10px;}
</style>

公共的html

<div id="scrollDiv">
	<ul id="scroll-container" style="margin-top: 0px;">
    <li>1 clone()克隆匹配的DOM元素并且选中这些克隆的副.</li>
    <li>2 appendTo()把所有匹配的元素追加到另一个、指定的元素元素集合中。</li>
    <li>3 eq()减少匹配对象到一个单独得dom元素.</li>
    <li>4 fadeIn()通过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数.</li>
    <li>5 fadeOut()能过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数.</li>
    <li>6 parent()取得一个包含着所有匹配元素的唯一父元素的元素集合。 可以通过一个可选的表达式进行筛选.</li>   
    <li>7 show()以优雅的动画显示所有匹配的元素，并在显示完成后可选地触发一个回调函数.</li>
    </ul>
</div>

1.淡入淡出

	jQuery(function ($) {
		//对于横向的时候 如果出现多个时候会使用
		$('#scroll-container li').each(function(index,domEl){
			if(index >=4)
				$(domEl).hide() ;
		});
		setInterval('scroll_news()',2000);
	});
	
    function scroll_news(){
		var $firstNode = $('#scroll-container li');                       
		$firstNode.eq(0).fadeOut('slow',function(){   
			$(this).clone().appendTo($(this).parent()).hide();
			$(this).remove();
			$firstNode.eq(4).fadeIn('slow');
			
		});
    }

2.滑动

	var runTime ;
	jQuery(function ($) {
		runTime = setInterval('scroll_news()',2000);
		$("#scrollDiv").mouseover(function(){ 
			clearInterval(runTime);
		}); 
		$("#scrollDiv").mouseout(function(){ 
			runTime = setInterval('scroll_news()',2000);
		}); 
	});
	function scroll_news(){    
		$("#scrollDiv").find("ul:first").animate({marginTop:"-25px"},1000,function(){
			$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);
        });
    }