Hey everyone - Hope you can offer some guidance. I am pretty novice when it comes to HTML and CSS but can navigate around the simple things.
I am trying to get the three promo images on my home page to have a different image on mouse hover. I do not believe the code invokes product loop - so I am at a bit of a loss here.
I am using the minimal theme.
The code that makes the promo images appear on the index page is:
{% if settings.show_fp_images %}
<!-- Begin promo images -->
<div class="row" id="fp-images" style="margin-bottom:0px">
{% for i in (1..3) %}
{% capture fp_image %}fp_image_{{ i }}.jpg{% endcapture %}
{% capture fp_link %}fp_image_{{ i }}_link{% endcapture %}
{% capture fp_alt %}fp_image_{{ i }}_alt{% endcapture %}
<div class="span4">
<a href="{{ settings[fp_link] }}">
<img src="{{ fp_image | asset_url }}" alt="{{ settings[fp_alt] | escape }}" />
</a>
</div>
{% endfor %}
</div>
<!-- End promo images -->
{% endif %}
The code below it that invokes the product loop, etc does not impact the three promo images. I know this by commenting out all that code and nothing happens to the promo images. I have tested it with the code commented out and active - no change.
So, is there any code I can add / edit the above that will reference different images on hover? I have three separate images and each image will have a 2nd image on hover.
Thank you! I really appreciate your help.