<!DOCTYPE html> <html > <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <img src="img/1.jpeg" id="flower"> <br> <button id="prve" ...
<!DOCTYPE html> <html >
<head> <meta charset="UTF-8">
<title>Document</title> </head>
<body> <img src="img/1.jpeg" id="flower"> <br> <button id="prve">上</button> <button id="next">下</button> <script> // 獲取id var flower=document.getElementById('flower'); var nextbtn=document.getElementById('next'); var prve=document.getElementById('prve'); var minindex=1; maxindex=4;currentindex=minindex; //定義點擊事件 nextbtn.onclick=function(){ currentindex++; if(currentindex==maxindex) { currentindex=1; } flower.setAttribute('src','img/'+currentindex+'.jpeg') }
prve.onclick=function(){ currentindex--; if(currentindex==minindex) { currentindex=4; } flower.setAttribute('src','img/'+currentindex+'.jpeg') } </script> </body>
</html>
