Ion-scroll cannot drag to right

ionic-v1
1

hi all,

I create a scroll with a number of images as below

    <div ng-show="showFrame">
      <ion-scroll zooming="true" direction="x" style="width: 2500px; height: 180px">
        <a ng-click="drawFrame(1)"><img src="img/frames/frame1.png" width="180"/></a>
        <a ng-click="drawFrame(2)"><img src="img/frames/frame2.png" width="180"/></a>
        <a ng-click="drawFrame(3)"><img src="img/frames/frame3.png" width="180"/></a>
        <a ng-click="drawFrame(4)"><img src="img/frames/frame4.png" width="180"/></a>
        <a ng-click="drawFrame(5)"><img src="img/frames/frame5.png" width="180"/></a>
        <a ng-click="drawFrame(6)"><img src="img/frames/frame6.png" width="180"/></a>
        <a ng-click="drawFrame(7)"><img src="img/frames/frame7.png" width="180"/></a>
        <a ng-click="drawFrame(8)"><img src="img/frames/frame8.png" width="180"/></a>
        <a ng-click="drawFrame(9)"><img src="img/frames/frame9.png" width="180"/></a>
      </ion-scroll>
    </div>

When I drag the scroll area to left and release, it returns back to the first two items. Thus I am not able to see the images at right side.
The horizontal scrollbar is same as screen width, which should be smaller.

Can anyone help? Thank you so much.

image
problem.jpg602×521 19.7 KB

2

Try adding scrollX=“true” like the following:

< ion-scroll zooming="true" direction="x" scrollX="true" style="width: 2500px; height: 180px" >

3

hi Brad

Thank you so much for your reply.

Adding scrollX=“true” doesn’t help. I am using ionic 1.7.5.

4

Ah, I see. Sorry that didn’t work for you. Unfortunately I’m at Ionic 3.