CODEWITHSUNDEEP
javascriptcssangularjsionic-framework
Chamara Maduranga
Chamara Maduranga

Reputation: 256

How to dispaly full page image in ionic app

I am using ionic tab template & in my app there is a page with full image, that image getting form json response.

Here is the my html code 

<ion-content class="padding">
    <img src="{{img}}" alt="" class="full-image">
</ion-content>

My question is how to handle image resolution in different devices. If any one have idea please share with me

Upvotes: 1

Views: 127

Answers (1)

Grigoris Dimopoulos
Grigoris Dimopoulos

Reputation: 124

I wanted to handle images in different devices and I did this in my controller:

 $scope.width=$window.innerWidth*0.65;//65% of the width
//change the percentage to fit your goals

 $scope.height=$window.innerHeight*0.65; //65% of the height
//change the precentage to fit your goals

and used it like this in the .html :

<img ng-src={{image.src}} height={{height}} width={{width}} />

I don't know if this is the best way, but it works!

Upvotes: 1

Related Questions