Hi all, wondering if anybody has any ideas if it is possible to do the following in F3. I have an image tile with a header title in the middle, I’m wanting when I hover over the tile for the background to change from an image to the solid Primary colour fill. The Header title remains in view unchanged both before and after hover.
I got part way there with Whimsy, the rollover action works perfectly but I can’t have a header title in the prehover display.
I’m going to have a delve in to Blacksmith to see if anything can be done there but thought I’d ask in case anybody is able to point out something obvious I may be missing.
Naturally when you finally decide, well I’ve tried everything I’ll post on the forum, doesn’t it always go that you discover the solution 5 mins later. I’ll keep this post up for future reference for others.
Solution:
Blacksmith
Create new stylesheet (unless using the one provided if adding Blacksmith for the first time)
Psuedo Class set to Hover
Activate Background Color in stylesheet settings
Set the background colour
Activate Important Overide in the stylesheet settings
Apply stylesheet class name to the Background tool that wanting to change
Ensure the Background tool this is applied to has an original solid fill set at 0% opacity.
This Background tool with the class applied to it now needs to go inside another Background tool that has the image as the background fill.
What you have in effect is a Background with an image set as the backgound, inside this is another Backgound with a 0% opacity solid colour fill with the class applied to fill with the stylesheet fill on hover. One background is covering the other on hover.