Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <style> .content { width: 360px; height: 360px; overflow: hidden; cursor: pointer; } .content img { transition: transform .5s ease-in-out; } /* The Transformation */ .content:hover img { transform: scale(2) rotate(35deg); } </style> </head> <body> <p>Hover over the images to see the effect.</p> <div class="content"> <img src="/uploads/media/default/0001/05/6b9dca3dac1686cb8c6bb4bdc3c26cb17ec0b970.png" alt="Image" /> </div> </body> </html>