Different image on hover for blog summary/listing page?

[NicoleT]

Trying to establish if this is possible.

My designer wants a different image to display on hover, for the blog listing page. I believe I'd need to add a image field to the post template, but is it possible to reference that image from the summary template?

[NicoleT]

Hi @webdew , thanks for your help!

So I could add it as a background image in the CSS file, but I'd need to manually hardcode it  for each post essentially? 

[webdew]

Hi @NicoleT ,

Yes, you can use background CSS and nth CSS to specify the listing. 

For more you can refer this doc-https://www.w3schools.com/cssref/sel_nth-child.asp

Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.

Thanks and Regards.

[webdew · Accepted solution]

Hi @NicoleT ,

You can add the style at hover but you cannot add an image field to the post template because the image comes from a featured image tag and we can do it with hard code using JS and advanced CSS but it should be defined on a particular listing. 

Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.

Thanks and Regard.