Zoom with ion-scroll: Size of zoomable are

ionic-v1
1

Hello,

I use <ion-scroll> to zoom into a picture. At first the whole image is visible through css:

.zoom-img{
   max-width: 100%;
    max-height: 100%;
}

The image might just use one third of the screen. Once I zoom in, the zoomable are is only as big as the original image. But I would like that the image fills the whole screen if the zoom factor is high enough.

This is my template:

<ion-content has-header="true">
    <ion-scroll direction="xy" locking="false" zooming="true" min-zoom="0.5">
        <img src="{{model.img}}" class="zoom-img"/>
    </ion-scroll>
</ion-content>

Do you know how to achieve that?

Thank you in advance!

2 
<ion-scroll direction="xy" scrollbar-x="false" scrollbar-y="false"
      overflow-scroll="false" zooming="true" min-zoom="0.5" 
      style="width: 100%; height: 100%" >
           <div class="zoom-img" style="background-image: url( {{model.img}} )" >
           </div>
   </ion-scroll>

  .zoom-img{
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center, center;
}