CODEWITHSUNDEEP
jquerycssjquery-mobileibm-mobilefirst
svd
svd

Reputation: 43

image resize to fit screen on mobile device using jquery mobile

I want to know if we can resize an image to fit the screen. Right now the image is suitable for iphone 5s, but it does not resize to another device or tablet to fit the screen.

I want to know if anyone has idea of how to resize to fit the screen.

This is my code.

<img alt="" src="images/main1.jpg" style="width:100%;height:auto;position:absolute;z-index:500"></img>

Upvotes: 1

Views: 22730

Answers (1)

Suchan Lee
Suchan Lee

Reputation: 607

What you want to do is to put the image inside a div whose width is set to be some percentage of the full screen width. This will always fit the image to be the width of the screen.

sample code:

<body>
    <div style="width: 100%;">
        <img alt="" src="images/main1.jpg" style="width: 100%;">
    </div>
</body>

JSFiddle: http://jsfiddle.net/5unWm/

Upvotes: 3

Related Questions