Eps 14: Rotating Images

Welcome to Talking HTML, an audio/video internet thing for web developers who are just starting out

Please go to iTunes and Stitcher to rate the show! Ratings get listeners!!

If you leave a good comment it could end up on the front page of the site!

 

http://www.Webdevpod.com for all the content and links

@TNPWDesign

@tommnorman

DreamHost promo code – tnpw

 

 

Code

<!DOCTYPE html>
<html lang=”en”>
<head>
<title>
</title>
<meta charset=”utf-8″>
<!–[if lt IE 9]>
<script src=”http://html5shim.googlecode.com/svn/trunk/html5.js”></script>
<![endif]–>
</head>
<style>

#wood {
/* 1st set of icons. Rotate them 360deg onmouseover and out */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

img#wood:hover{
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}

</style>
<body>
<img src=”images/other-room.png” id=”wood”>
</body>
</html>