I need to rotate an image and keep the aspect ratio relative to the parent DIV without 'escaping'. I'm just using rotate(90deg)
and the original properties of the image, as in the example.
There are a few plugins that do this but it contains a lot of unnecessary stuff, I believe that some settings in CSS
solve, but not the attributes to manipulate images in this way.
$('button').click( function( event )
{
$('img').css({ transform : 'rotate(90deg)' })
})
div{border:#000000 solid 1px; width:200px; height:300px; text-align:center}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><button>girar</button><div><imgsrc="http://i.ebayimg.com/images/g/v7sAAOSwQTVV7toe/s-l300.jpg">
</div>