<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>轮播原理图</title>
</head>
<body>
<div>
<! - default and add two buttons appearing ->
<Button the onclick = "PREV ()"> one </ Button>
<IMG ID = "Slider" the src = "Image / 1.jpg" />
<button onclick = "next () "> next </ Button>
</ div>
<-! JS Code ->
<Script>
<! - definition of an array of pictures into rotation ->
var Images = [
"Image / 1.jpg",
"Image / 2.jpg",
"Image / 3.jpg"
];
<! - definition of a start number 0>
var NUM = 0;
<! Next button click event ->
Next function () {
var Slider = document.getElementById ( "Slider");
num ++;
! IF (num> = images.length) {<- If the length of the array num appears greater than or equal to 0 (Note here that the return length of the array is from 1 is calculated , and the array is from 0 counted ) ->
NUM = 0;
}
slider.src = Images [NUM]; <- src attribute change ->!
}
<! - on a button click event ->
PREV function () {
var Slider = document.getElementById ( "Slider");
num--;
! IF (num <0) {<- num if there is less than 0, then the length of the array returns -1 (Note here that the length of the array is from a calculation , the array is from 0 counted ) ->
NUM = images.length-1;
}
slider.src = Images [NUM]; <- src attribute change ->!
}
</ Script>
</ body>
</ HTML>