I know the image swap question has been asked ad nasuem but mainly as it relates to a hover interaction. I'm creating a prototype and want to allow the user to toggle between different selected states for a particular section of a build experience. See the image below, I want the user on click to be able to change between automatic or manual transmission. I was thinking of creating a tab interaction but the hit state for the "tabs" is dead center of the div. To be clear I want users to be able to click back and forth between the two options.
I had experimented with the "set background image for your div to one image, and on click change transparency" but it messes up when you try and click back and forth.
Anyway look forward to what you guys think is the best way to set this up.