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

WBOY
풀어 주다: 2016-05-16 17:35:27
원래의
882명이 탐색했습니다.

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

코드 복사 코드는 다음과 같습니다.
;< ;/title>

;







< td>

;







코드 복사

코드는 다음과 같습니다.
폭: 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');
}
})

})

;







🎜>

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿