Voorbeeld

Select & Copy Voorbeeld 1  
<style type="text/css"> .hover_image:hover {text-decoration: none} /* Optional (avoid undesired underscore if a is used as wrapper) */ .hide {display:none;} /* Do the shift: */ .hover_image:hover img:first-child{display:none;} .hover_image:hover img:last-child{display:inline-block} </style> <a class="hover_image" href="#" download><!-- path/to/first/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/download/Download-to-laptop-icon.png" alt="Download" width="75" /><!-- path/to/hover/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/download/laptop-download-icon.png" alt="Download" width="75" class="hide" /></a>

Select & Copy Voorbeeld 2
<style type="text/css"> .hover_image:hover {text-decoration: none} /* Optional (avoid undesired underscore if a is used as wrapper) */ .hide {display:none;} /* Do the shift: */ .hover_image:hover img:first-child{display:none;} .hover_image:hover img:last-child{display:inline-block} </style> <a class="hover_image" href="#" download><!-- path/to/first/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/download/Download-to-laptop-icon.png" alt="Download" width="75" /><!-- path/to/hover/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/download/laptop-download-icon.png" alt="Download" width="75" class="hide" /></a> <a class="hover_image" href="/contact"><!-- path/to/first/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/ico/Chat-icon.png" alt="Download" width="75" /><!-- path/to/hover/visible/image: --><img style="margin-right: 80;" src="https://tooljunkie.eu/img/ico/Messages-icon.png" alt="Download" width="75" class="hide" /></a>