[Share] Hover Gallery Image – Show another image

You can follow these steps to achieve effect.

If you can't make it work, you can send link to page where you use gallery + code you added, I can check again easier.

#1. First, find Gallery Section ID

In my example, we have

section[data-section-id="66aba2c59905c849edbe7322"]

#2. Use this code to Custom CSS box. Replace Pixabay with your image url.

section[data-section-id="66aba2c59905c849edbe7322"] {
  figure:nth-child(1):hover img {
      content: url(https://cdn.pixabay.com/photo/2023/04/07/05/59/woman-7905583_1280.jpg);
  }
  figure:nth-child(2):hover img {
      content: url(https://cdn.pixabay.com/photo/2024/01/25/10/50/mosque-8531576_1280.jpg);
  }
  figure:nth-child(3):hover img {
      content: url(https://cdn.pixabay.com/photo/2024/02/23/19/37/tufted-duck-8592681_1280.jpg);
  }
  figure:nth-child(4):hover img {
      content: url(https://cdn.pixabay.com/photo/2024/08/02/21/54/antique-car-8940770_1280.jpg);
  }
}

#3. Note

#4. If you can't how to get Image URL, you can see this