# Consultation on images

**URL:** <https://forum.ionicframework.com/t/consultation-on-images/18526>\
**Category:** ionic-v1\
**Created:** [March 3, 2015, 1:45pm UTC](https://forum.ionicframework.com/t/consultation-on-images/18526 "2015-03-03T13:45:22Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![sioesi](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@sioesi](https://forum.ionicframework.com/u/sioesi)\
**Post date:** [March 3, 2015, 1:45pm UTC](https://forum.ionicframework.com/t/consultation-on-images/18526/1 "2015-03-03T13:45:22Z")

</div>

Friends anyone know how I can put an image and the user can zoom on images? I could not find a way.

---

<div class="post-metadata">

**Author:** ![santinowu](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/santinowu/32/7815_2.png) [@santinowu](https://forum.ionicframework.com/u/santinowu)\
**Post date:** [March 3, 2015, 3:36pm UTC](https://forum.ionicframework.com/t/consultation-on-images/18526/2 "2015-03-03T15:36:15Z")

</div>

HI,

Are you looking for [this](http://ionicframework.com/docs/api/directive/ionScroll/)? Try the following example and run `$ ionic serve` to see the effect:

```auto
<ion-scroll zooming="true" min-zoom="1" max-zoom="3" scrollbar-x="false" scrollbar-y="false" direction="xy" has-bouncing="false" style="width: 100%; height: 100%; margin:auto; background-color: rgba(0,0,0, .1); line-height: 0;">
      <img ng-src="http://lorempixel.com/1200/1200/food" style="width: 100%; height: auto; margin: 0; max-width: 100%; max-height: 100%;">
</ion-scroll>

```

BTW, you’d better create css class instead of inline styles 😄

---

<div class="post-metadata">

**Author:** ![sioesi](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@sioesi](https://forum.ionicframework.com/u/sioesi)\
**Post date:** [March 3, 2015, 3:56pm UTC](https://forum.ionicframework.com/t/consultation-on-images/18526/3 "2015-03-03T15:56:45Z")

</div>

What strikes me is that the image is cut to make zoom. There is much documentation of that example but not what I want, it’s like when you see pictures on Facebook from mobile

---

<div class="post-metadata">

**Author:** ![ariestiyansyah](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ariestiyansyah/32/64720_2.png) [@ariestiyansyah](https://forum.ionicframework.com/u/ariestiyansyah)\
**Post date:** [March 3, 2015, 8:16pm UTC](https://forum.ionicframework.com/t/consultation-on-images/18526/5 "2015-03-03T20:16:43Z")

</div>

There are several angularjs plugin you can use, listed below ;

1. Angular Pan Zoom : [https://github.com/mvindahl/angular-pan-zoom](https://github.com/mvindahl/angular-pan-zoom)
2. Angular Image Zoom : [https://github.com/owlsomely/angular-image-zoom](https://github.com/owlsomely/angular-image-zoom)
3. Image zoom : [https://github.com/evxn/image-zoom](https://github.com/evxn/image-zoom)

please explore 😃

---

<div class="post-metadata">

**Author:** ![Calendee](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/calendee/32/13656_2.png) [@Calendee](https://forum.ionicframework.com/u/Calendee)\
**Post date:** [March 25, 2015, 10:45am UTC](https://forum.ionicframework.com/t/consultation-on-images/18526/6 "2015-03-25T10:45:48Z")

</div>

You might also want to try [https://github.com/mhartington/PinchToZoom](https://github.com/mhartington/PinchToZoom) from @mhartington