Michael4771079
Posts: 0
Joined: Sat Jul 21, 2012 2:03 pm

prevent header from scrolling

it it possible to fix the header and footer, I would prefer if the header didn't scroll,
like it does in the s/s

Image

Maryna Brodina
Posts: 0
Joined: Thu Apr 05, 2012 7:27 am

prevent header from scrolling

Hello! This post should help https://getsatisfaction.com/apperyio/...

Michael4771079
Posts: 0
Joined: Sat Jul 21, 2012 2:03 pm

prevent header from scrolling

Hi Marina,
I tried this css and exported ipa, no effect, header still scrolls, I would like it to be fixed in the top of the screen and not to move

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;
}

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

prevent header from scrolling

Hi Michael,

Sorry, it took some time. Here are the steps for you.

  1. Select Mobile Container on page (it is between Header and Footer) and set property "Class Name" = "scrollable"

  2. Create the following CSS asset:
    https://gist.github.com/anonymous/13c...

  3. Create JavaScript asset with the following code:
    https://gist.github.com/anonymous/d03...

Michael4771079
Posts: 0
Joined: Sat Jul 21, 2012 2:03 pm

prevent header from scrolling

Thanks Katya,
do I remove css from Marina?

Igor
Posts: 0
Joined: Tue Apr 02, 2013 12:05 pm

prevent header from scrolling

Hello.

Yes, you should remove css from Marina.

Michael4771079
Posts: 0
Joined: Sat Jul 21, 2012 2:03 pm

prevent header from scrolling

thx Igor

Michael4771079
Posts: 0
Joined: Sat Jul 21, 2012 2:03 pm

prevent header from scrolling

Hi,
I have removed previous css and added the css and js from the links above, I have set the class on 2 screens, 1. login, 2.profile
the result is difficult to explain,

the splash screen has a part of the image missing, as if someone removed the header although the screen has no header

the login screen is very unusual, there is flicker on scroll.
the container header and footer scroll, sometimes the footer ends up in the middle of the screen

all other pages are in a state of no scrolling at all, header, footer, container everything,even if the container is bigger than the screen of the phone, any component below the footer cannot be viewed or interacted with

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

prevent header from scrolling

Hi Michael,

If "Class Name" - "scrollable" is not added to page then it won't be able to scroll.

The solution we advised can't work if all the content fit the screen.

DanGarrett
Posts: 0
Joined: Wed May 08, 2013 1:45 pm

prevent header from scrolling

Hi,

I just found a solution for iOS (Haven't tested on Android)

No need to mess with CSS etc, just go to Resources then Config.xml in your Xcode project and change "UiWebViewBounce" to false.

Hope this helps.

Return to “Issues”