Refresh display problems

1

Hi there
I am just experimenting a kind of refreshing or displaying problems, which are better seen in the attached pics (tested on chrome 35):

then, when scrolling down, SOMETIMES, I get this effect:

The template for this layout is just as follow:

<ion-view title="{{guideName}}">
  <ion-nav-buttons side="left">
    <button menu-toggle="left" id="chapterinfo-menu-toggle" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>

  <ion-content class="has-header">
    <div class="guide-title">{{chapterInfo.name}}</div>
    <div ng-show="hasAuthors" style="text-align: center; margin-bottom: .5em;">
      <span ng-bind-html="authors"></span>
    </div>

    <div class="chapter-content">
      <p ng-repeat="paragraph in chapterInfo.content" ng-bind-html="paragraph"></p>
    </div>

    <ion-list>
      <!-- bibliograph -->
      <ion-item class="item item-icon-right" ng-show="hasBibliograph"
           href="#/app/bibliograph/{{guideId}}/{{chapterInfo.id}}"
           style="margin-bottom: .5em; margin-top: .5em">
        <span class="itemguide">Bibliograph</span>
        <i class="icon ion-chevron-right"></i>
      </ion-item>

      <!-- accordion -->
      <div ng-repeat="sec in listSecs">

        <div class="item item-icon-right" ng-class-odd="'list-odd'" ng-class-even="'list-even'"
             ng-click="toggleGroup(sec)"
             href="#"
             style="text-overflow: clip; white-space: normal"
             ng-class="{active: isGroupShown(sec)}">

          <i class="icon"
             xng-show="sec.subsecs !== undefined && sec.subsecs.length > 0"
             ng-class="isGroupShown(sec) ? 'ion-minus' : (sec.subsecs !== undefined && sec.subsecs.length > 0)? 'ion-plus': 'ion-chevron-right'">
          </i>
          <span class="chapteritem">{{sec.name}}</span> 
        </div>
        <!-- subitems -->
        <ion-item class="item-accordion"
                  ng-show="isGroupShown(sec) && sec.content.length > 0">
          <p ng-repeat="paragraph in sec.content"
             style="text-overflow: clip; white-space: normal; text-align: justify; padding: 0.5em 0 0.5em 0;"
             ng-bind-html="paragraph"></p>
        </ion-item>

        <ion-item class="item-accordion item-icon-right"
                  style="text-overflow: clip; white-space: normal"
                  ng-repeat="subsec in sec.subsecs"
                  ng-show="isGroupShown(sec)"
                  href="#/app/content/{{guideId}}/{{chapterInfo.id}}/{{sec.id}}/{{subsec.id}}">
          <i class="icon ion-chevron-right"></i>
          <div class="subsection">{{subsec.name}}</div>
        </ion-item>
      </div>
    </ion-list>

    <div class="gap"></div>
  </ion-content>
</ion-view>

Similar to that, it happens with the next sample just in the android emulator. In this case, item is overlapped or shadowed by the text in addition to scroll up (already hidden by the header):

The same uses to happen also in iphone 5s and, in general, across devices and browsers (specially mobile).
I am a bit frustrated, as it can be a kind of rare problem and I dunno if anybody had the same problem before. In the same way, I dunno whether or not is a code problem (mine) or there is a (unknown for me) workaround to avoid it yet.

Any suggestion appreciated
Thanks in advance

w i l l y

2

Sorry, duplicate of Ios scrolling duplicate content :-S. Sorry about this (not having search better, but I tried hard before), in the end was solved by installing 1.0.0b9 (last one) and it is fixed. You run so much fixing issues guys :smiley:

Thanks anyway