플래시와 같은 effect_image 특수 효과를 갖춘 JavaScript 3차원 그림 브라우저

추신: 렌더링 표시, 필요에 따라 그림 스타일을 조정할 수 있습니다

코드

코드 복사 코드는 다음과 같습니다.

<--왼쪽 화살표-->

🎜 >

🎜>< img id="img03" style="z-index:6; left:151px; top:0px; width:198px; height:198px;" onclick="JavaScript:showImg(0)"/> 🎜>< !--오른쪽 두 번째 사진-->

<script> <br>//이미지 목록 배열<br>var imgArray = new Array(); <br>imgArray[0]="1.jpg" <br>imgArray[1]="2.jpg" <br>imgArray[2]=" 3.jpg"; <br> imgArray[3]="4.jpg"; <br>imgArray[4]="5.jpg"; <br>imgArray[5]="6.jpg"; <br> imgArray[6]="7.jpg"; <br>imgArray[7]="8.jpg"; <br>imgArray[8]="9.jpg" <br>imgArray[9]="10. jpg"; <br>// 기본적으로 표시되는 사진 순서 번호 <br>var base = 0; <br>//오프셋을 지정하여 배열 순서의 이전 또는 다음 사진을 표시합니다. 오프셋 매개변수는 오프셋 <br>function showImg(offset ){ <br>base=(base-offset)%imgArray.length <br>//기본 번호부터 시작하여 5개의 그림 표시<br>for(var i=base;i<base 5; ;i ){ <BR>var img = document.getElementById("img0" (i-base 1)) <BR>//이미지가 앞에서 뒤로 루프로 표시되는지 확인<BR>if(i< 0){img.src = imgArray[imgArray .length i];} <BR>//그림이 뒤에서 앞으로 루프로 표시되는지 확인<BR>else if(i>(imgArray.length-1)) {img.src=imgArray[i-imgArray.length] } <br>else {img.src=imgArray[i];} <br>} <br>} <br>//이미지 브라우저에서 이미지 초기화 <br>function initImg(){ <br>showImg(3 ); <br>} <br>//페이지 로드 후 호출 <br>window.onload=initImg() <br></script>

function initimg(){
showImg(3)
}
window.onload=initimg()