JSFiddle - React, Tailwind, and code Playground
HTML
<script type="text/javascript" src="http://jqueryrotate.googlecode.com/svn/trunk/jQueryRotate.js"></script>
<input id="button" type="button" value="Portrait">
<input id="button2" type="button" value="LandscapeLeft">
<input id="button3" type="button" value="LandscapeRight">
<input id="button4" type="button" value="Upsidedown">
<div id="wrapper">
<img src="https://www.google.com/images/srpr/logo3w.png" id="image">
<div>
CSS
#wrapper
{
position:absolute;
top: 100px;
left: 100px;
max-height: 100px;
min-height: 100px;
border: 2px solid red;
}
JavaScript
var angle = 0;
$('#button').on('click', function() {
angle = 90;
$("#image").rotate(angle);
});
$('#button2').on('click', function() {
angle = 180;
$("#image").rotate(angle);
});
$('#button3').on('click', function() {
angle = 180;
$("#image").rotate(angle);
});
$('#button4').on('click', function() {
angle = -90;
$("#image").rotate(angle);
});