<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'>
<HTML>
<head>
<script>
var step = 100;
var cell = 100, total = 4, width = cell * total;
var imageCount = 8;
function do_left(){
var obj = document.getElementById("photo_layer").style;
var obj_left = obj.left;
var obj_left_without_px = obj_left.substring(0,obj_left.lastIndexOf("px"));
if (obj_left_without_px < 0)
{
var obj_left_calculate = (Number(obj_left_without_px)+step)+"px";
obj.left= obj_left_calculate;
}
}
function do_right(){
var obj = document.getElementById("photo_layer").style;
var obj_left = obj.left;
var obj_left_without_px = obj_left.substring(0,obj_left.lastIndexOf("px"));
if (obj_left_without_px > (imageCount*cell*(-1)+width))
{
var obj_left_calculate = (Number(obj_left_without_px)-step)+"px";
obj.left= obj_left_calculate;
}
}
</script>
</head>
<body>
<table border="1">
<tr align="center" style="height: 100px" bgcolor="#ffffff">
<td><img src="./image/01.jpg" style = "width: 98px; height: 100px" onclick="do_left()"></img></td>
<td>
<div style="top: 0px; left: 0px; height: 100px; width: 400px; overflow:hidden; position: relative" >
<div id="photo_layer" style="top: 0px; left: 0px; width: 800px; height: 80px; position: relative">
<table style="height: 100px" cellspacing="0" cellpadding="0">
<tr align="center" bgcolor="#cccccc">
<td width='100'><IMG src="./image/01.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/02.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/03.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/04.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/05.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/06.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/07.jpg" width='98'></img></td>
<td width='100'><IMG src="./image/08.jpg" width='98'></img></td>
</tr>
</table>
</div>
</div>
</td>
<td><img src="./image/01.jpg" width="98" height="100" onclick="do_right()"></img></td>
</tr>
</table>
</body>
</HTML>
'php' 카테고리의 다른 글
이미지 사이즈 알아내는 자바스크립트 (0) | 2008.11.15 |
---|---|
ie firebug and firephp url (0) | 2008.11.05 |
[ajax] html문서의 결과값을 받아오는 ajax 예제 (0) | 2008.10.07 |
php로 ftp만들기 (0) | 2008.09.16 |
php 프로그램 실행 속도 구하기 (0) | 2008.08.12 |