Do you want to just have the icon, or do you want the stock quantity as well.
And you can't do this with PHP code with options.
Once the page is rendered, there is no PHP. It was done before the page was created so it in fact does not exist as far as the web page is concerned. When you select options, the only method to update the page is with javascript and for that, you need id tags for each icon and a method to trigger the proper image to appear.
Look at the product image code on the demo in product FEATURED1
This is the page source that is generated.
Code: Select all
<script language="JavaScript">
$(document).ready(function(){
UpdateImage(10,"product");
});
</script>
<input type="hidden" id="product_thumb_10" value="http://www.alegrocart.com/demo/image/cache/Featured1-250x250.jpg">
<input type="hidden" id="product_popup_10" value="http://www.alegrocart.com/demo/image/Featured1.jpg">
<input type="hidden" id="product_thumb_10:17" value="http://www.alegrocart.com/demo/image/cache/Featured1-250x250.jpg">
<input type="hidden" id="product_popup_10:17" value="http://www.alegrocart.com/demo/image/Featured1.jpg">
<input type="hidden" id="product_thumb_10:18" value="http://www.alegrocart.com/demo/image/cache/Featured2-250x250.jpg">
<input type="hidden" id="product_popup_10:18" value="http://www.alegrocart.com/demo/image/Featured2.jpg">
<input type="hidden" id="product_thumb_10:19" value="http://www.alegrocart.com/demo/image/cache/Featured3-250x250.jpg">
<input type="hidden" id="product_popup_10:19" value="http://www.alegrocart.com/demo/image/Featured3.jpg">
<input type="hidden" id="product_thumb_10:20" value="http://www.alegrocart.com/demo/image/cache/Featured4-250x250.jpg">
<input type="hidden" id="product_popup_10:20" value="http://www.alegrocart.com/demo/image/Featured4.jpg">
<input type="hidden" id="magnifier_width" value="125">
<input type="hidden" id="magnifier_height" value="125">
</a>
</div>