Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

First, you have to enable the extension in Stores > Configuration > Magenest > Catalog Image Hovering

 

Enable Module: Choose Yes to enable Catalog Image Hovering 

Default hovered Image: 

  • Yes: The first image in product’s gallery, except from product’s image, will be set as hovered image.

  • No: Choose No to set hover image manually.

 Animation: 5 types of hover animation 

  • No animation

  • Fade into

  • Transition Left To Right

  • Transition Right To Left

  • Transition Bottom To Top

  • Transition Top To Bottom 

Duration: the length of time that an animation takes to complete one cycle. 

Easing: animation’s performance speed 

  • Ease In: slow start and fast end

  • Ease Out: fast start and slow end

  • Ease In Out: slow start, fast middle, and slow end

  • Ease: like Ease In Out but its start slightly faster than end

  • Linear: no easing 

Animation starts when hovering over 

  • Product Image: show another image when hovering product image

  • Product Wrapper: setting hovered image to shows up when mouse is moved to product container.



Set the hovered image manually

 In each product settings > Images and Video settings

Image Added


 

  • Upload images for product

  • Browse to each image to set the role for them

  • Set “Hovered” role for hover image

Image Added


(warning) Note: Each role belongs to only one image in product’s gallery


Image Added


Click on Save to save the configuration.


Update

  • When a new update is available, we will provide you with a new package containing our updated extension.
  • You will have to delete the module directory and repeat the installing steps above.
  • Flush the config cache. Your store and newly installed module should be working as expected.

...