Hide navbar dynamically


#1

Hello,
I have a Tab Project, I want that when are in a concrete view and user turn phone on landscape mode the navbar disappear, and when user switch it to portrait appear again.

I try to made with CSS:

@media all and (max-width: 1024px) and (orientation:landscape) {
   ion-tabbar {
       display: none !important;
   }
}

But apply to all views, we only need to apply to concrete view / controller.

Regards


#2

Might be tricky. You could do this with plain javascript by detecting landscape and setting display to none, but there is a simpler but ugly hack.

You could have the view shift the nav bar to the top of the window. Try a negative margin-top

@media all and (max-width: 1024px) and (orientation:landscape) {
.your-view {
margin-top: -44px !important;
}
}

#3

Thanks @Srijith for your attention.

The two hacks are very ugly hahaha. I do it with jQuery.

Regards,
Pau.