Monday, March 11, 2013

Resizing image for Mobile devices.


I had to research a problem of resizing images for mobile. It's quite interesting, because my designer suggested to have to images for landscape and portrait views.  Taking her opinion, I decided to reseach by myself and found one very good idea over the Internet.  It's quick, easy and it works:
Javascript:
After initializing jQuery and jQueryMobile, place the script in a header
<script type="text/javascript">
    $(document).ready(function() {
$width = $('#content').width();
$('#content img').css({
'max-width' : $width , 'height' : 'auto'

});
    });
    </script>
HTML:
 <div id="content"><img src="temp.jpg" /></div>