Javascript Picturebox Array

Javascript Picturebox Array

Code:
<html>
<head>
<title>Javascript With Pictures waqeeh ul hasan</title>
<script>

var description = new Array("Picture 1", "Picture 2", "Picture 3", "Picture 4");
var pictures = new Array(3);
var counter = 0;


function initialize(){
  // sets up the array with some startin values
  // Andy Harris
  pictures[0] = new Image(50, 50);
  pictures[0].src = "images/1.jpg";
  pictures[1] = new Image(50, 50);
  pictures[1].src = "images/2.jpg";
  pictures[2] = new Image(50, 50);
  pictures[2].src = "images/3.jpg";
  pictures[3] = new Image(50, 50);
  pictures[3].src = "images/1.jpg";
   pictures[4] = new Image(50, 50);
  pictures[4].src = "images/2.jpg";

} // end initialize

function upDate(){
  //increments the counter and shows the next description
  counter++;
  if (counter > 4){
    counter = 0;
  } // end if
  document.imgDisplay.src = pictures[counter].src;
  document.myForm.txtDescription.value = description[counter];
} // end upDate

</script>
</head>

<body onLoad = "initialize()">
<center>
<h1>Javascript With Pictures<hr></h1>
<form name = "myForm">
<img src = "images/1.jpg"
     name = "imgDisplay"
     height = 300
     width = 300>
<br>

<input type = "text"
       name = "txtDescription"
       value = " Picture 01">
<br>
<input type = "button"
       value = "Next"
       onClick = "upDate()">
     
 </form>
</center>
<hr>
</body>
</html>

 Screen Shot:


Popular posts from this blog

Real marksheet using HTML

Salary Calculate Application in C#