<html>
<head><title></title></head>
<body>
<script language="javascript">
var imgList;
var currPos = 0;
var dispCnt = 3;
function setDefaultPict(imgArr)
{
imgList = imgArr.split(":");
}
function goLeft() {
if(currPos <= 0) {
alert("더이상 이동할 수 없습니다.");
return;
}
currPos = currPos - 1;
for(var i=dispCnt - 1; i>=0; i--) {
var destIdx = i;
var srcIdx = i - 1;
var destEl = document.getElementById("img" + destIdx);
var srcEl = document.getElementById("img" + srcIdx);
destEl.setAttribute("src", srcEl.getAttribute("src"));
srcEl.setAttribute("src", imgList[srcIdx + currPos]);
}
var destEl = document.getElementById("img" + (dispCnt - 1));
var srcEl = ingList[(dispCnt - 1) + currPos];
}
function goRight() {
if(currPos + dispCnt + 1 > imgList.length) {
alert("더이상 이동할 수 없습니다.");
return;
}
currPos = currPos + 1;
for(var i=0; i<dispCnt-1; i++) {
var destIdx = i;
var srcIdx = i + 1;
var destEl = document.getElementById("img" + destIdx);
var srcEl = document.getElementById("img" + srcIdx);
destEl.setAttribute("src", srcEl.getAttribute("src"));
srcEl.setAttribute("src", imgList[srcIdx + currPos]);
}
var destEl = document.getElementById("img" + (dispCnt - 1));
var srcEl = ingList[(dispCnt - 1) + currPos];
}
</script>
<table>
<tr>
<td><a href="#" onclick="goLeft()">◀</a><td>
<td><img id="img0" src="test0.jpg" width="200" height="200"/></td>
<td><img id="img1" src="test1.jpg" width="200" height="200"/></td>
<td><img id="img2" src="test2.jpg" width="200" height="200"/></td>
<td><a href="#" onclick="goRight()">▶</a><td>
</tr>
<table>
<script language="javascript">
setDefaultPict('test0.jpg:test1.jpg:test2.jpg:test3.jpg:test4.jpg:test5.jpg:test6.jpg:test7.jpg');
</script>
</body>
</html>
<head><title></title></head>
<body>
<script language="javascript">
var imgList;
var currPos = 0;
var dispCnt = 3;
function setDefaultPict(imgArr)
{
imgList = imgArr.split(":");
}
function goLeft() {
if(currPos <= 0) {
alert("더이상 이동할 수 없습니다.");
return;
}
currPos = currPos - 1;
for(var i=dispCnt - 1; i>=0; i--) {
var destIdx = i;
var srcIdx = i - 1;
var destEl = document.getElementById("img" + destIdx);
var srcEl = document.getElementById("img" + srcIdx);
destEl.setAttribute("src", srcEl.getAttribute("src"));
srcEl.setAttribute("src", imgList[srcIdx + currPos]);
}
var destEl = document.getElementById("img" + (dispCnt - 1));
var srcEl = ingList[(dispCnt - 1) + currPos];
}
function goRight() {
if(currPos + dispCnt + 1 > imgList.length) {
alert("더이상 이동할 수 없습니다.");
return;
}
currPos = currPos + 1;
for(var i=0; i<dispCnt-1; i++) {
var destIdx = i;
var srcIdx = i + 1;
var destEl = document.getElementById("img" + destIdx);
var srcEl = document.getElementById("img" + srcIdx);
destEl.setAttribute("src", srcEl.getAttribute("src"));
srcEl.setAttribute("src", imgList[srcIdx + currPos]);
}
var destEl = document.getElementById("img" + (dispCnt - 1));
var srcEl = ingList[(dispCnt - 1) + currPos];
}
</script>
<table>
<tr>
<td><a href="#" onclick="goLeft()">◀</a><td>
<td><img id="img0" src="test0.jpg" width="200" height="200"/></td>
<td><img id="img1" src="test1.jpg" width="200" height="200"/></td>
<td><img id="img2" src="test2.jpg" width="200" height="200"/></td>
<td><a href="#" onclick="goRight()">▶</a><td>
</tr>
<table>
<script language="javascript">
setDefaultPict('test0.jpg:test1.jpg:test2.jpg:test3.jpg:test4.jpg:test5.jpg:test6.jpg:test7.jpg');
</script>
</body>
</html>
'WEB_Programming > Javascript' 카테고리의 다른 글
| JavaScript 습작... (0) | 2008.10.15 |
|---|---|
| [JAVASCRIPT] insertBefore (0) | 2008.08.11 |
| [HTML] 동영상 플레이 처리하기 (0) | 2008.07.30 |
| Javascript에서 쿠키 처리하기 (0) | 2008.07.18 |
| JSON 소개 (0) | 2008.07.01 |
