Thursday, 3 April 2014

Image Slider using Javascript without using jQuery.

abcd.html

<html>
<head>
<title> Auto Change Background Color </title>
<style type="text/css">
div
{
height:320px;
width:100%;
}
</style>
<script type = "text/javascript">
var image = new Array ('pic-1.jpg', 'pic-2.jpg', 'pic-3.jpg', 'pic-10.jpg','pic-11.jpg');

var image_index = 0;
function ChangeBgImage ()
 {

   document.getElementById("ddiv").style.backgroundImage="url("+image[image_index]+")";
    image_index++;
    if (image.length == image_index)
     {
           image_index = 0;   
      }   
}
setInterval( "ChangeBgImage()", 1000);
</script>
</head>
<body>
<div id="ddiv">
</div>
</body>
</html>

No comments:

Post a Comment