Copy codeThe Code is as follows:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> </title>
<Style type = "text/css">
# Mydiv {position: absolute; width: 500px; height: 400px; top: 50%; left: 50%; margin-top:-200px; margin-left:-290px ;}
Img {width: 480px; height: pixel PX ;}
</Style>
<Script src = "jquery-1.9.1.js" type = "text/javascript"> </script>
<Script src = "Jquery1.7.js" type = "text/javascript"> </script>
<Script type = "text/javascript">
$ (Function (){
Var array = [1, 2, 3, 4, 5, 6];
Var count = 0;
// Return
$ ('# Button1'). click (function (){
If (count> 0 ){
Count --;
$ ('Img '). attr ('src', 'images/' + array [count] + '.jpg ');
}
})
// Forward
$ ('# Button2'). click (function (){
If (count <5 ){
Count ++;
$ ('Img '). attr ('src', 'images/' + array [count] + '.jpg ');
}
})
})
</Script>
</Head>
<Body>
<Div id = "mydiv">
<Table> <tr> <td> <input id = "Button1" type = "button" value = "<"/> </td> </td> <input id = "Button2" type = "button" value = ">"/> </td> </tr> </table>
</Div>
</Body>
</Html>
The effect is as follows: