Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
ionic slide box dynamic height - fixes the issue where the slide boxes aren't taking up the full height of the device
app.directive('dynamicHeight', function() {
return {
require: ['^ionSlideBox'],
link: function(scope, elem, attrs, slider) {
scope.$watch(function() {
return slider[0].__slider.selected();
}, function(val) {
//getting the heigh of the container that has the height of the viewport
var newHeight = window.getComputedStyle(elem.parent()[0], null).getPropertyValue("height");
if (newHeight) {
elem.find('ion-scroll')[0].style.height = newHeight;
<ion-slide class="slide" dynamic-height>
<div class="slide-box box">
<!-- your stuff -->

This comment has been minimized.

Copy link

eicu commented May 20, 2015

It haven't work for me, because the height of elm.parent was 0px.
If anyone have the same problem -> I have fixed it by get the height of the ion-content tag.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.