点击按钮切换图片


//js代码

//封装获取id的函数

function $(id){

  return document.getElementById(id);

}

//图片路径

var arrPic = ["1.jpg","2.jpg","3.jpg","4.jpg"];

//自定义下标
var index = 0;
$("center").src = arrPic[index];

//点击下一张按钮
$("next").onclick = function(){
index++;
if( index == arrPic.length ){
  index = 0;
}
  $("center").src = arrPic[index];
}

//点击上一张按钮
$("pre").onclick = function(){
  index--;
  if( index == -1 ){
  index = arrPic.length-1;
}
  $("center").src = arrPic[index];
}

 

//HTML代码

<div id="big">
<div id="next">></div>
<div id="pre"><</div>
<img id="center" />
</div>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM