Ion-slide box issue

ionic-v1
1

I have 4 slide which is coming ng-repeat. Each slide has more then 100 lines of content. while sliding, Content is getting overlap on footer (ion-tab bar) for few second. How can fix it ?

2

How do you have the slide marked up?

3 
This the code for sliding-
HTML-
    <ion-slide-box on-slide-changed="slideChanged(index)">
                <ion-slide ng-repeat="index in practicSupportSlideMenuDisplay">
                    <div id="contant"  class="slideContent scroll">
                        <div class="imageBackground">
                            <div class="image"><img  style="width: 100%" src="img/{{index.supportIndexDetailImg}}.png" ></div>
                        </div>
                        <div class="display-contant">
                            <h3>{{index.supportIndexDetailTitle}}</h3>
                            <h5>{{index.supportIndexDetailDesc}}</h5>
                            <div class="padding">`enter preformatted text here`
                                <button type="button" style="margin-bottom:2%;" id="submit" class="button" ng-click="downloadeFileFromServer(index.supportIndexDetailDownloadURL)">Get a Copy</button>
                            </div>
                        </div>
                    </div>
                </ion-slide>
            </ion-slide-box>
4

Try using this markup

<ion-slide-box>
  <ion-slide>
    <ion-content>
      <!-- Your content --> 
   </ion-content>
  </ion-slide>
</ion-slide-box>

And add this css.

.slider{
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

It will put your content inside and ion-content, and that will adjust for your footer

5

Ok. i will try in above structure and let you know.

But,In sliding there is one more issue. I have three slide with different height.
1- 1000px
2- 3000px
3- 4000px
For slide first and second taking height 4000px. why?
It should take as per the content.
How can we resolve this issue?

6

Is your slide-box wrapped by an ion-content? If so, it shouldn’t. Open you app in Chrome or Safari, try seeing if there are and console issues or weird css errors. There are many things that could be wrong