Eps 14: Rotating Images – Talking HTML
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>