// JavaScript Document
//輪播圖函式
 function autoMoveImg(tagImg,tagBotton){
 var imgs = document.getElementsByTagName(tagImg); //獲取img圖片物件陣列
 var buttons = document.getElementsByName(tagBotton); //獲取圖片顯示位置按鈕物件陣列

//輪播圖動態函式
 function InitMove(index){
		for(var i=0;i<imgs.length;i++){
			imgs[i].style.opacity='0'; //將圖片的透明度置為0使其透明
			buttons[i].style.background='rgba(0,0,0,0.1)';//顯示圖片位置按鈕樣式改變
		}
		imgs[index].style.opacity='1';//將當前需要顯示的圖片透明度置為1使其顯示出來
		buttons[index].style.background='rgba(0,0,0,1.0)';
	}

//執行頁面載入完成後的首次輪播圖動態函式
InitMove(0);
var count = 1;//圖片物件陣列中每張圖片物件對應的索引值

//count調整函式
 function fMove(){
		if(count==imgs.length){ //當輪播超過了最後一張圖的索引值時count置為0
			count=0;
		}
		InitMove(count); //執行輪播圖動態函式
		count++; //count自加一
	}

//設定計時器函式，每2.5秒執行一次count調整函式
 var scollMove = setInterval(fMove,2500);
var btnleft = document.getElementById('btnleft'); //獲取左翻按鈕物件
var btnright = document.getElementById('btnright'); //獲取右翻按鈕物件

btnleft.onclick = function(){ //左翻按鈕點選事件
		clearInterval(scollMove); //清除計時器函式
		if(count==0){ //如果圖片索引為0及第一張圖索引值，則將索引值置為圖片物件陣列長度
			count=imgs.length; 
		}
		count--; //索引值自減一變為最後一張圖的索引值
		InitMove(count); //執行輪播圖動態函式
                scollMove = setInterval(fMove,2500); //重新設定計時器函式
	};

 btnright.onclick = function(){//右翻按鈕點選函式（與左翻同理，不再贅述）
		clearInterval(scollMove);
		fMove();
		scollMove = setInterval(fMove,2500);
	}
}

window.onload = function(){autoMoveImg('img','lun');} //在頁面載入完成後執行輪播圖函式

html程式碼段
 

<div class="lunbotu" >
		<img src="img/lunbotu/1.jpg"/>
		<img src="img/lunbotu/2.jpg"/>
		<img src="img/lunbotu/3.jpg"/>
		<button name="bo" style="margin-left: 40px;" id="btnleft" type="button">←</button>
		<button name="bo" style="margin-left: 400px;" id="btnright" type="button">→</button>
		<button name="lun" style="margin-left: 30px;" type="button" value="0" >1</button>
		<button name="lun" style="margin-left: 80px;" type="button" value="1" >2</button>
		<button name="lun" style="margin-left: 130px;" type="button" value="2" >3</button>
</div>
 

製作輪播圖有還很多方法，比如改變z-index的層疊順序，和display屬性等。但是要注意的是，img，button的定位要為絕對定位並且編寫順序不能打亂。
好了，上一張效果圖。