최대한 간단한 이미지 슬라이더 (클릭시 이동)

<style type="text/css">
	#img_list td { width:100px; text-align:center; }
</style>

<div id="img_list" style="width:300px; height:100px; overflow:hidden;">
	<table class="" width="1700" align="center" cellpadding="0" cellspacing="0">
		<tr>
		<td><img src="http://superkts2.img.paran.com/icon/img001.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img002.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img003.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img004.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img005.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img006.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img007.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img008.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img009.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img010.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img011.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img012.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img013.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img014.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img015.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img016.gif"></td>
		<td><img src="http://superkts2.img.paran.com/icon/img017.gif"></td>
		</tr>
	</table>
</div>

<input type="button" name="" value="<" onclick="scroll_left()"> <input type="button" name="" value=">" onclick="scroll_right()">
눌러 보세요 *^^*

<script type="text/javascript">

	var amt = 10;	// 움직임 값 (클수록 빠름)
	var gap = 100;	// 이미지와 사이 공간의 합

	var cnt = 0;
	var init_amt = amt;

	function scroll_right(){
		document.getElementById('img_list').scrollLeft += amt;
		if(cnt >= gap){
			cnt = 0;
			var adj = document.getElementById('img_list').scrollLeft % gap;
			document.getElementById('img_list').scrollLeft -= adj;
			amt = init_amt;
		}
		else{
			amt = Math.ceil(amt / 1.2);
			setTimeout(scroll_right, 10);
		}
		cnt = cnt + amt;
	}

	function scroll_left(){
		document.getElementById('img_list').scrollLeft -= amt;
		if(cnt >= gap){
			cnt = 0;
			var adj = document.getElementById('img_list').scrollLeft % gap;
			if(adj > 0) adj = gap - adj
			document.getElementById('img_list').scrollLeft += adj;
			amt = init_amt;
		}
		else{
			amt = Math.ceil(amt / 1.2);
			setTimeout(scroll_left, 10);
		}
		cnt = cnt + amt;
	}

</script>