Sinevik,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
article{
position: absolute;
height: 100px;
width: 100px;
background-color: #FFFFFF;
}
div {
position: relative;
}
</style>
</head>
<body>
<input name="" type="button" value="prev" onclick="prev()"> <input name="" type="button" value="next" onclick="next()">
<div>
<article style="z-index: 10">1</article>
<article>2</article>
<article>3</article>
<article>4</article>
<article>5</article>
</div>
<script>
var slider = document.getElementsByTagName("article");
var index = 0;
function next()
{
slider[index].style.zIndex = 1;
index = ++index % slider.length;
slider[index].style.zIndex = 10;
}
function prev()
{
slider[index].style.zIndex = 1;
--index < 0 && (index = slider.length - 1);
slider[index].style.zIndex = 10;
}
</script>
</body>
</html>