Hello friends! I have 5 images on my page. These images are layered on each other using Z-index in css class. Out of these 5 images I have assigned a css class to 4 images and for one image i.e. first image img1 I have added css effect using style property in image tag only. Now out of these 5 images first image img1 is always visible and out of remaining 4 images only 1 image is visible and other three images remain hidden. These 4 images I have assigned a css class. Question I have 3 buttons on page and each having different purpose and function. I just want to know that which 2 images are visible i.e. shown (not hidden) on page when any of these three button is clicked using Jquery.
A rough HTML code is as follows to get brief idea
<html>
<head>
</head>
<body>
<input type="button" id="button_1" name="zoomin" value="Zoom In" tabindex="18">
<input type="button" id="button_2" name="zoomout" value="Zoom Out" tabindex="19">
<input type="button" id="button_3" name="original" value="Original" tabindex="20">
<div id="div1" class="test1" >
<img src="images/base.jpg" style="z-index:1; position:absolute; top:0; left:0; width:550; height:750">
<img src="images/yellow_refno.gif" class="classforimg">
<img src="images/yellow_title.gif" class="classforimg">
<img src="images/yellow_gender.gif" class="classforimg">
<img src="images/yellow_gender.gif" class="classforimg">
</div>
</body>
</html>
So friends please help me! Thank You!