How can I change the background image while hovering over text

Hi! I'm trying to create a homepage with a list of my pages, but I want the background image to change as the mouse hovers over the page title... I've achieved this by using a portfolio template, but would prefer to just use CSS to keep it less complicated with navigation. I hope this makes sense! I've attached images if that helps :-) 

Thanks <3 

You can't use CSS to create this effect. It needs JavaScript, very complicated.

@tuanphan Is there really no way to achieve this? I would gladely use JavaScript.

This tutorial is pretty bad, but the concept is pretty ok. 
https://www.youtube.com/watch?v=yBACksdYbpQ

The problem is how to target the background of the section.

You can use Portfolio Page, then we can change portfolio title url with JavaScript code