当您向上滚动以显示内容时，如何防止离子幻灯片向下“反弹”？

Question

http://codepen.io/leongaban/pen/yeBjWx

Note above, try to scroll the list to reveal the content at the bottom. Once you let go of the mouse the list scrolls or rather "rubber-bands" back down, hiding the content once again.

Markup

<ion-content>
  <div class="social-stream-container">
    <ion-scroll direction="y" id="social-tweets">
      <ion-list>
        <ion-item class="social-content-block" ng-repeat="t in tweets | filter: orderBy">
          {{t}}
        </ion-item>
      </ion-list>
    </ion-scroll>
  </div>
</ion-content>

Styling (the content box has a certain height, so user needs to be able to scroll to see more)

.social-stream-container {
  overflow: hidden;
  height: 187px;
  background: cyan;
}

I tried adding this to the ion-scroll : has-bouncing="false" but that stopped any kind of scrolling at all.

Answer 1

Here is the fix: http://codepen.io/leongaban/pen/yeBWWB

The div with class of social-stream-container was removed and that class was then placed on the ion-scroll element.

<ion-slide id="twitter">
    <h1>TWEETS</h1>
    <ion-scroll class="social-stream-container" direction="y" id="social-tweets">
      <ion-list>
        <ion-item class="social-content-block" ng-repeat="t in tweets | filter: orderBy">
          {{t}}
        </ion-item>
      </ion-list>
    </ion-scroll>
</ion-slide>