Image Rollover

sreein1986 0 90 Views

First take two images named with smirk1.jpg and smirk2.jpg with same size
paste below code and for Image write this code

<IMG src="smirk1.jpg" name="smirk" onMouseOver="over(0);" onMouseOut="out(0);" />

<script type="text/javascript">
var revert = new Array();
var inames = new Array('smirk');

// Preload
if (document.images) {
  var flipped = new Array();
  for(i=0; i< inames.length; i++) {
    flipped[i] = new Image();
    flipped[i].src = ""+inames[i]+"2.JPG";
  }
}
 
function over(num) {
  if(document.images) {
    revert[num] = document.images[inames[num]].src;
    document.images[inames[num]].src = flipped[num].src;
  }
}
function out(num) {
  if(docu <script type="text/javascript">
var revert = new Array();
var inames = new Array('smirk');
 
// Preload
if (document.images) {
  var flipped = new Array();
  for(i=0; i< inames.length; i++) {
    flipped[i] = new Image();
    flipped[i].src = ""+inames[i]+"2.JPG";
  }
}
 
function over(num) {
  if(document.images) {
    revert[num] = document.images[inames[num]].src;
    document.images[inames[num]].src = flipped[num].src;
  }
}
function out(num) {
  if(document.images) document.images[inames[num]].src = revert[num];
}
</script>
Member Avatar for ayesha789
ayesha789 7 Posting Pro in Training

I design 2 pictures as shirk1.jpg and shirk2.jpg and
in body I use Image Tag and in Head I put script.
But it only shows image1 that is shirk1.jpg

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

Edit Preview