텍스트 롤링(rolling)

* style

<style>
.ticker {
	height: 30px;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ticker li {
	height: 30px;
	padding: 5px;
	margin: 0px 5px;
}
</style>

* script

<script>
function tick() {
	$('#ticker li:first').fadeOut(function() {
		$(this).appendTo($('#ticker_01')).fadeIn(100); // li 첫번째 요소를 fadeOut 처리뒤에 li 요소 마지막으로 붙이고 fadeIn
	});
}
setInterval(function(){ tick () }, 5000);
</script>

* html

<div>
	<ul id="ticker" class="ticker">
		<li><a href="#">111</li>
		<li><a href="#">222</li>
		<li><a href="#">333</li>
		<li><a href="#">444</li>
	</ul>
</div>