Hello,
I am using a <ion-scroll>
element inside a <ion-slide>
The scroll element has n number of <ion-list>
and will be populated dynamically and expected to exceed the devise height.
The scroll works fine BUT when I push the elements up to reveal the elements at the bottom - the scroll pushes it back the moment the finger is lifted from the touch screen. Same thing happens with mouse when testing on the PC.
How can I scroll the elements up and lock there ? Please help.
The code I wrote is as follows:
<ion-nav-view animation="slide-left-right">
<ion-slide-box on-slide-changed="slideHasChanged(index)" slide-interval="0">
<ion-slide>
<!-- Openning Page of the App -->
<div>
<div class="bar bar-header bar-balanced">
<h1 class="title">News App</h1>
</div>
<div>
<img alt="" ng-src="img/avatars/page-one.png" width="100%" usemap="homemap">
<map name="homemap">
<area shape="rect" coords="132,321,360,516" ng-click="listSlide()" />
</map>
</div>
</div>
</ion-slide>
<ion-slide>
<div>
<div class="bar bar-header bar-balanced">
<h1 class="title">Select News</h1>
<button class="button button-icon icon ion-ios7-search-strong"></button>
</div>
<div class="list-container">
<h5>Select a channel from the list </h5>
<ion-scroll>
<ion-list>
<ion-item ng-repeat="i in channelList" class="channel-list-item list-items">
<img alt="" ng-src="{{i.img}}" class="circular-image" width="15%">
{{i.name}}
</ion-item>
</ion-list>
</div>
</ion-scroll>
</div>
</ion-slide>
</ion-slide-box>
</ion-nav-view>