Ion-slide-box with different slide heights

Question

Ion-slide-box with different slide heights

I'm using ion-slide-box, but the issue is, my ion-slides are not in the same height, So it sets all the ion-slides to the size of heights one. Following is an example

ion-slide 1 height 30px
ion-slide 2 height 100px

so, ion-slide-box height will be 100px, which make a blank space (70px) in the slide1. And when the user slide by using that blank space (70px), slider doesnt work. (Pardon me , if the question was not clear, its bit hard to explain)

What could be the way/workaround to have the slidebox work for different slide heights

thanks in advance

cheers,

Sam

javascript
ionic-framework
slide

Answer 1

If you want a fixed height slider with every slides filling the slider height without leaving any blank space, In style.css add these lines:

.slider {
height: 200px; /* slider height you want */
}
.slider-slide {
 color: #000;
 background-color: #fff;
 height: 100%;
}

Answer 2

$ionicScrollDelegate.resize(); did the trick

check this for codepen