How to pinch to zoom image in the Slider?

i am using the example in :

And i want to pinch to zoom the image in the Slider so that i add the class ion-scroll-zoom in the slides. But it seems not work.

<ion-slides [options]="extraOptions" id="slider" style="background-color: black" class="ion-scroll-    zoom">
  <ion-slide *ngFor="#image of images">
   <img data-src="{{getImageUrl(image)}}" slide-lazy>

Any success with this?

Will be available with beta.7


Hi there,
Is this feature included yet? We are on 8 now and still can’t see it.

+1. I also need this feature. Will it be available ?

@ghprod any updates on this?

1 Like

In the Slides API documentation we can see a zoom input property.

Unfortunately, I’ve not tried it yet.

The zoom property is not working in 3.0.1

I`m also looking for it all over the web. But nothing seems to work.

1 Like

Hello all,
Any update on this topic,
i am having same issue.
i applied zoom property on ion-slides tag, but error comes when try to zoom image

TypeError: Cannot read property 'getAttribute' of null
at toggleZoom (swiper-zoom.js:364)


<ion-slides pager="true" style="height:45%" zoom>
    <ion-slide *ngFor="let slide of selProd.productImages">
      <img src="{{slide.image}}">

zoom = “true” will get it work

@saintxiao I used same code with zoom="true", but the fallowing error occurred to me.
TypeError: Cannot read property 'getAttribute' of null

        <ion-slides pager="true" style="height:auto" dir="rtl" zoom="true">
        <ion-slide *ngFor="let images of post.attachLists ">
        <img src="{{images.filename}}" style="height:auto">

I managed to get the zoom working by wrapping the image with .swiper-zoom-container class. But still I can’t move the position of the image when zooming. It’s zoomed to the center.

   <ion-slides class="slider-inner" pager="true" paginationType="bullets" loop="true" zoom="true">
      <ion-slide *ngFor="let item of">
        <div class="swiper-zoom-container">
          <img class="img-holder" data-src="{{item}}" slide-lazy>

Anyone else having the same issue? Found a fix?

HI, I am having same issue in Ionic 4, someone have found how to fix it?