At first, you must specify two things:
- the CSS property you want to add an effect to and
- the duration of the effect.
div {
transition: opacity 0.5s;
-webkit-transition: opacity 0.5s; /* Safari */
}
Then, you must specify :hover for the div element:
div:hover {
opacity: 0.5;
}
Learning resources
- Create slick HTML5 animations article.