How to find out which images are shown i.e visible and which images are hidden using jquery?
<p>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. 
<strong>Question</strong>
    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. </p>

<p>A rough HTML code is as follows to get brief idea </p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;input type="button" id="button_1" name="zoomin" value="Zoom In" tabindex="18"&gt;
&lt;input type="button" id="button_2" name="zoomout" value="Zoom Out" tabindex="19"&gt;
&lt;input type="button" id="button_3" name="original" value="Original" tabindex="20"&gt;

&lt;div id="div1" class="test1" &gt;
    &lt;img src="images/base.jpg" style="z-index:1; position:absolute; top:0; left:0; width:550; height:750"&gt;
    &lt;img src="images/yellow_refno.gif" class="classforimg"&gt;
    &lt;img src="images/yellow_title.gif" class="classforimg"&gt;
    &lt;img src="images/yellow_gender.gif" class="classforimg"&gt;
    &lt;img src="images/yellow_gender.gif" class="classforimg"&gt;          
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>So friends please help me!
Thank You!</p>
