This post shows the scenario where you need to show an image when doing a mouse-over on a radio button in html. You can customize the code further as per your requirement.
In your html or server side code file, add the below style under the head tags:
<style>
span .hover-img {
position:relative;
}
span .hover-img span {
position:absolute; left:-9999px; top:-9999px; z-index:9999;
}
span:hover .hover-img span {
top: 20px;
left:0;
}
</style>
Add the below html code under the body tag of the file as below:
<span><div class="hover-img"><font face="Arial"><input type="radio" value="option1" name="myradio"><font size="2">Option 1
</font><span><img src="Mouseover1.png" alt="image" height="100" /></span></div></span><br />
<span><div class="hover-img"><font face="Arial"><input type="radio" value="option2" name="myradio"><font size="2">Option 2
</font><span><img src="Mouseover2.png" alt="image" /></span></div></span>
Run the final code in a browser to see the results.