I am trying to create a website like the following:
Similar to this site, when users hover over the category the main image below changes. What is the best way to achieve this through Magento? Should the images be assigned to the category pages or...? This is my existing CSS for the current, main image:
body.cms-home .main-container {
background: url(../images/main.jpg);
background-size: 100%;
}Perhaps this even needs to be assigned through the CMS Page for the 'home page' since this reaction will only appear on the home page.
Or maybe I can link the hover-option on the text with the above CSS and change the image name each time? Like this (only this doesn't seem to be working):
body.cms-home .main-container #nav li.level0.nav-4 a:hover {
background: url(../images/main2.jpg);
background-size: 100%;
}Any guidance will be extremely appreciated!