Subheaders not moving content down?

1

I have a subheader that is hidden by default and is toggle-able by a button located on the top right navigation header. Is there a way for that subheader to also push content down so that it doesn’t overlap when the subheader is shown?

2

try to add class “has-subheader” conditionally to the ion-content and trigger $ionicScrollDelegate.resize() to resize scroll container of the ion-content.

3

Whats the code for you sub-header.

It should be something like this.

ion-view
  ion-header-bar
  ion-header-bar.bar-subheader
  ion-content
4

@mhartington
i think his code is correctly, but in his app you can toggle the subheader -> so you have to add the has-subheader class after “showing” the subheader and triggering a ion-content-resizing for correct scroll behavior.

The same if you hide the subheader -> remove the class and toggle resizing.

5

Yeah, but you don’t need to add any classes to ion-content. It has a watch for any headers, footers, tabs, and subheaders.

http://demo.ionicframework.com/nightly/ionHeaderBar/simple/

1 Like
6

Okay in an older ionic version i needed this if i was using ng-show/hide.