쇼핑몰에서 볼수있는 스크롤 상품이미지 입니다. 보통 플래쉬로 재작하지만 자바스크립트로도 충분히 가능합니다.
 수정이 가능한 부분
<script language=javascript>
<!--
var downLayerId;
var dropDegree = 5; //스크롤 속도
var doDirect;
var DirectTerm = 4000; //스크롤 지연시간
var curDropIdx = 0;
 화면 출력부분
<body onLoad="DirectDown();">
<table cellspacing=0 cellpadding=0 border=0>
<tr>
<td>
<div style="left:0px; overflow:hidden; width:635px; position:relative; top:0px; height:130px">
<div id=DropHit style="left:0px; visibility:visible; width:635px; position:absolute; top:0px; height:130px">
<table border=0 cellpadding=0 cellspacing=0 width=635>
<tr>
<td><img border=0 src=img/1.gif></td>
<td><img border=0 src=img/2.gif></td>
<td><img border=0 src=img/3.gif></td>
<td><img border=0 src=img/4.gif></td>
<td><img border=0 src=img/5.gif></td>
</tr>
</table>
</div>
<div id=DropHit style="left:0px; visibility:visible; width:635px; position:absolute; top:-200px; height:130px">
<table border=0 cellpadding=0 cellspacing=0 width=635>
<tr>
<td><img border=0 src=img/6.gif></td>
<td><img border=0 src=img/7.gif></td>
<td><img border=0 src=img/8.gif></td>
<td><img border=0 src=img/9.gif></td>
<td><img border=0 src=img/10.gif></td>
</tr>
</table>
</div>
</div>
</td>
<td>
<table cellspacing=0 cellpadding=0 width=13 border=0>
<tr><td><a href="javascript:DirectUp()"><img border=0 src=img/up.gif></a></td></tr>
<tr><td align=center><img height=100 width=1 src=binimg.gif></td></tr>
<tr><td><a href="javascript:DirectDown()"><img border=0 src=img/down.gif></a></td></tr>
</table>
</td>
</tr>
</table>
붉은색으로 표시된부분은 빠져서는 안되는 부분입니다.
노란색으로 표시된부분은 상품이 출력되는 부분의 레이어 위치이며, 최상단의 상품이 0 이면 다음상품은 상품이미지의
높이만큼 입력되어야 합니다.(가장 위부터 아래로 플러스 됩니다.)
보라색으로 표시된 부분은 스크롤 컨트롤러의 링크 주소입니다. DirectUp 이 스크롤을 위로 올리는것이며, DirectDown이
스크롤을 아래로 내리는 것입니다.
|
