Page 1 of 4

How to deactivate fixed header and footer ?

Posted: Fri Jan 27, 2012 10:59 am
by Timothée

How can I deactivate fixed headers and footers on my mobile web app designed with tiggzi ?


How to deactivate fixed header and footer ?

Posted: Fri Jan 27, 2012 5:56 pm
by maxkatz

Do you want to make them fixed or hide them completely? If you want to hide them, in screen properties (click outside the phone frame), uncheck Show Header/Show Footer.


How to deactivate fixed header and footer ?

Posted: Fri Jan 27, 2012 5:59 pm
by Timothée

Neither, I want to disable fixed header and footer. is that possible from the interface or will i have to dive into the code ?


How to deactivate fixed header and footer ?

Posted: Fri Jan 27, 2012 6:03 pm
by maxkatz

From the builder you can hide them. If you want to do anything else, you would do it via JavaScript. What exactly do you mean by disabled? Do you have an example? I know that jQuery Mobile now has fixed header in the latest release (not final yet).


How to deactivate fixed header and footer ?

Posted: Thu Feb 07, 2013 2:54 pm
by Ricki Ricardo

I have similar question. I need to make footer and header static, because in iOS (from 5 version) have next problem.
https://www.youtube.com/watch?v=TH1qL_...
I tried to make header fixed. I remove classes from header, footer and page

Code: Select all

    $('div[data-role="header"]').removeAttr("data-position"); 

$('div[data-role="header"]').removeClass("ui-header-fixed");
$('div[data-role="header"]').removeClass("ui-fixed-overlay");
I didn't work. And I tried to remove other classes.

$('div[data-role="page"]').removeClass("ui-page-footer-fixed");
$('div[data-role="page"]').removeClass("ui-page-header-fixed");

But I have next result.
https://www.youtube.com/watch?v=9plkBN...
I need to fix bug in iOS, or make header and footer static.

Thanks you in advice.


How to deactivate fixed header and footer ?

Posted: Thu Feb 07, 2013 8:53 pm
by maxkatz

When you say static, do you mean persistent so that footer/header stay on when you scroll?


How to deactivate fixed header and footer ?

Posted: Fri Feb 08, 2013 9:01 am
by Ricki Ricardo

Yes.


How to deactivate fixed header and footer ?

Posted: Fri Feb 08, 2013 9:27 am
by Maryna Brodina

Hello! Try to use next CSS:

div[data-role=header], div[data-role=footer] {
position : absolute;
}


How to deactivate fixed header and footer ?

Posted: Fri Feb 08, 2013 9:39 am
by Ricki Ricardo

I tried do this early, but I have this effect when I did previous steps like in the video.
Image


How to deactivate fixed header and footer ?

Posted: Fri Feb 08, 2013 2:19 pm
by Maryna Brodina

Try this CSS:

div[data-role=header], div[data-role=footer],
.ui-page [data-role=header].ui-fixed-hidden,
.ui-page [data-role=footer].ui-fixed-hidden
{
position : absolute !important;
}