Korean English Japanese

매우 심플한 슬라이더(Very Simple Slider)

반응형

Simple Slider

정말 간단한 슬라이더(Very Simple Slider)

3(3000)초 마다 전환되는 매우 간단한 슬라이더입니다. 별도의 애니메이션 전환 효과나 페이지네이션 기능이 없고 심지어 이전/다음 버튼도 없습니다. 전환 효과는 Javascript 코드에 기능을 추가하면 쉽게 만들 수 있습니다. (예: .animate()) 이미지의 갯수는 상관없이 계속해서 추가할 수 있으며, 매우 간단하게 수정할 수 있습니다.

아주 간단한 전환되는 광고배너 등을 만들 때 사용하면 좋습니다.

 

 

<img src="Img1.jpg" id="mainImage" alt="Simple Slider" style="width:1000px; height:auto;">

<script>
var myImage=document.getElementById("mainImage");
var imageArray=["Img1.jpg","Img2.jpg","Img3.jpg","Img4.jpg"];
var imageIndex=0;

function changeImage(){
	myImage.setAttribute("src",imageArray[imageIndex]);
	imageIndex++;
	if(imageIndex>=imageArray.length){
		imageIndex=0;
	}
}
setInterval(changeImage,3000);
</script>
반응형