How to resize image on mobile devices using jQuery?

Question

I am working on a mobile website and I have a div & image inside it like this:

<div id="wrapper">
    <div id="content">My img tag here</div>
</div>

I want to know, how I can resize the image on any phone/tablet without worrying about its resolution, size or orientation. Here, I am looking for the best possible solution based on the above scenarios.

Answer 1

I found a simple solution using jquery....

$(document).ready(function() {

    $width = $('#content').width();

    $('#content img').css({
        'max-width': $width,
        'height': 'auto'
    });
});

​