Should I use CSS or Javascript for this hover use case?

Question

I'm building a site where there is an image and icon within a container. I want to be able to hover over the container and the image would move up by 40px, icon would move right by 40px. Do I need to use Javascript in this case or is there a solution that can leverage only CSS?

Thanks in advance.

Answer 1

No reason to get JavaScript involved - simply use the pseudo-selector :hover in CSS. Others have suggested various ways to do so in answers to this question.

If you want the image to be animated upwards, not just instantly move, you can use CSS animations as well.

Answer 2

Reasons to use CSS over JS

1- CSS is easier than Javascript

2- JavaScript can be disabled

3- CSS is faster than JavaScript