js code_javascript 기술을 구현하기 위한 그림 보기(앞으로 및 뒤로) 기능

참고: 이미지 폴더의 사진 이름은 1부터 5.jpg까지입니다.
선언된 var array = [1, 2, 3, 4, 5]; 🎜>

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

;< ;/title>

;







< td>

;







코드 복사

코드는 다음과 같습니다.

;style type=" text/css"> #mydiv { 위치: 절대

폭: 500px

상단: 50%; 🎜>왼쪽: 50%;
여백-상단: -200px;
여백-왼쪽: -290px;
}
img
{
높이 : 380px;
}

type="text/ javascript">
$(function () {
//첫 번째 방법
/*
$('#btn1').toggle(function () { $(' img') .attr('src', 'images/1.jpg'); },
function () { $('img').attr('src', 'images/2.jpg'); },
함수 () { $('img').attr('src', 'images/3.jpg') },
함수 () { $('img').attr(' src', 'images/4.jpg'); },
function () { $('img').attr('src', 'images/5.jpg') }); 🎜>$ ('#btn2').toggle(function () { $('img').attr('src', 'images/5.jpg'); },
function () { $(' img') .attr('src', 'images/4.jpg'); },
function () { $('img').attr('src', 'images/3.jpg'); },
함수 () { $('img').attr('src', 'images/2.jpg') },
함수 () { $('img').attr(' src', 'images/1.jpg') });
*/

//두 번째 방법

var array = [1, 2, 3, 4, 5 , 6 ];
var count = 0;
//뒤로
$('#btn1').click(function () {
if (count > 0) {
count -- ;
$('img').attr('src', 'images/' array[count] '.jpg')
}
})
//앞으로
$ ('#btn2').click(function () {
if (count < 5) {
count ;
$('img').attr('src', 'images/ ' 배열 [개수] '.jpg');
}
})

})

;

🎜>