原始JS仿一个汽车网站的首页焦点图轮播效果

安装方法：

先加载两个必要文件

css/sucainiu.css

js/sucainiu.js

再加入一段JS

window.onload = function()
{
	var oBox = document.getElementById('box');
	var oPrev = getByClass(oBox,'prev')[0];
	var oNext = getByClass(oBox,'next')[0];
	var oBigUl = getByClass(oBox,'bigUl')[0];
	var aLiBig = oBigUl.getElementsByTagName('li');
	var oNumUl = getByClass(oBox,'numberUl')[0];
	var aLiNumber = oNumUl.getElementsByTagName('li');
	var oTextUl = getByClass(oBox,'textUl')[0];
	var aLiText = oTextUl.getElementsByTagName('li');
	var nowZindex = 1;
	var now = 0;
	function tab()
	{
		 for(var i=0; i'';
			}
			aLiNumber[now].className = 'night';
			
		aLiBig[now].style.zIndex = nowZindex++;
		aLiBig[now].style.opacity = 0;
		startMove(aLiBig[now],'opacity',100);
		for(var i=0; i'none';
		}
		aLiText[now].style.display = 'block'
		
	}
	
	for(var i=0; ifunction()
		{
		   
			if(this.index==now)return;
			now = this.index;
		   
			tab();
		}
	}
	oNext.onmouseover = oPrev.onmouseover = oBigUl.onmouseover = function()
	{
		startMove(oPrev,'opacity',100);
		 startMove(oNext,'opacity',100)
	}
	 oNext.onmouseout = oPrev.onmouseout = oBigUl.onmouseout = function()
	{
		startMove(oPrev,'opacity',0);
		startMove(oNext,'opacity',0)
	}
	oPrev.onclick = function()
	{
		now--
		if(now==-1)
		{
			now=aLiNumber.length-1;
		}
		tab();
	}
	
	  oNext.onclick = function()
	{
		now++
		if(now==aLiNumber.length)
		{
			now=0;
		}
		tab();
	}
	
	var timer = setInterval(oNext.onclick,3000)
	oBox.onmouseover = function()
	{
		clearInterval(timer)
	}
	oBox.onmouseout = function()
	{
		timer = setInterval(oNext.onclick,3000)//改变速度修改3000 ，例如3000=3秒钟
	}
}