Skip to main content
Solved

How to add image with mouse over image inside html widget

  • February 29, 2024
  • 4 replies
  • 65 views

juan.delrio
Forum|alt.badge.img+2

So I built a custom html widget using html table to reproduce the multiproduct homepage with custom icons.   Now I want to add a mouse over image to the product images.  How do i do that?

Best answer by juan.delrio

<img src="image1" onmouseover="this.src='image2'" onmouseout="this.src='image1'" />

4 replies

juan.delrio
Forum|alt.badge.img+2
  • Author
  • Helper ⭐️⭐️
  • Answer
  • February 29, 2024

<img src="image1" onmouseover="this.src='image2'" onmouseout="this.src='image1'" />


leo-inspired
  • Gainsight Employee ⭐️
  • March 1, 2024

I haven't tried that before, but it sounds interesting. I didn't know about the onmouseover thing. Can you tell me where you've used it in your community?


juan.delrio
Forum|alt.badge.img+2
  • Author
  • Helper ⭐️⭐️
  • March 1, 2024

So I wanted to create a Customer Facing Resource page that collects all our silos like the multiproduct page gainsight is using. But I wanted not square icons and I wanted 4 instead of 3 with out changing the home page which uses 3.  So I fell back on my good old HTML 4.0 roots and started with a table. :)

 

So now I have my 4 silos, with a descriptive mouse over for each one.   Now that I have the functional part out of the way, I can work on style :)


vishkatti
Forum|alt.badge.img+5
  • Gainsight Employee ⭐️
  • March 5, 2024

This is SO cool! Love it! Thanks so much for sharing Juan - This is super useful for the community :)