Dual Image Hover on Product Listings

Dual Image Hover on Product Listings

  • $39.99
Previous image
Dual Image Hover on Product Listings
Next image
Zoom image

Dual Image Hover for Product Lists

This module adds a clean “secondary image on hover” effect to product thumbnails in your storefront’s product lists (e.g., category pages, search results, and other product lists that use grid or list layouts). When a product has a second image available, the image swaps on hover (and on first tap on touch devices).

Key features

  • Second image hover effect for product lists (grid and list views).
  • Touch-friendly behaviour: first tap reveals the second image on mobile devices.
  • Only displays the effect when a second image is available.
  • Uses public product images where available, with safe fallback handling.
  • No core modifications required.
  • Lightweight implementation using template override, CSS, and minimal JavaScript.
  • Works with standard X-Cart product images and list rendering.

Compatibility

  • X-Cart 5.6 (customer storefront)
  • Designed to work with modern X-Cart skins and common product list layouts.

Installation

  1. Install the module.
  2. Rebuild cache.
  3. Open a category page and hover a product image to see the secondary image (where available).

Notes

  • If a product has only one image, the module displays the standard single image without changes.
  • The hover effect follows the existing thumbnail sizing defined by your theme.
  • Public images are preferred for secondary image display; fallback handling ensures compatibility across different store configurations.