Assignment029J3a2

CSS transitions allow you change property values from one value to another smoothly over a set period of time. You can easily utilize transitions using the :hover pseudo-class.

In this assignment, the animated divs have a :hover pseudo class where new property values are set. The #pooh div has the property transition: all 2s which allows the :hover properties to transition all changes over 2 seconds. In this case, I'm changing only the rotation from 7 deg to 5 deg.

#pooh
{
transition:all 2s;
transform:rotate(7deg);
background-image:url(Images/pooh.png);
background-repeat:no-repeat;
height:200px;
width:145px;
position:absolute;
bottom:-55px;
left:590px;
}

#pooh:hover
{
transform:rotate(5deg);
}