JQuery Mobile - Persistent header/navigation - jquery-mobile

is there a way to keep a persistent header in jQuery mobile?
I'd like to benefit from the changePage functionality and events offered by the framework, but want to keep the navigation the same across pages.

At the moment, jQuery Mobile's persistent headers disappears/reappears when you scroll.
But they are experimenting with a scrollview which might provide the functionality you are looking for. You can see the docs for the scrollview here.
Other than that, there's always iScroll

Related

JQuery Mobile 1.4.5 Fixed Persistent Header/Footer

I want to implement External Fixed Persistent Header/Footer in my hybrid APP.
My APP has:
let's say three initial "pages" with External Fixed Persistent Header but no Footer at all;
at that third "page" I have a link to a series of "pages" with
External Fixed Persistent Header, but now, they have also a External Fixed Persistent Footer.
I'm trying this schema without success. That is, fixed persistent header looks great, but the addition of persistent footer (from the fourth screen) is not working at all.
Is it possible or I must take a different design approach?
Best regards.

How to create a fluent pagination for mobile devices on a responsive website

I want users of my website to use pagination on their mobile devices, like for example UIScrollView with paging enabled in iOS.
Still the website should also be viewable on desktops.
So far, I tried Foundation's orbit, but that just doesn't feel fluent at all (when you release your finger, it performs the sliding a little delayed).
Is there any good alternative on how to get this done? If possible I would like the user to even slide vertically as well as horizontally.
Maybe Swipe.js is the thing you looking for.
have you tried SwipeView?
Here you have an demo gallery
I'm looking for this too, but I really think they are none.
If you want it to be fluid, you have create your own using CSS3 animation/transform and so it will not work on hold browser (IE < 10 or 11, but I'm not sure). If you want to handle touch events I recommend you to check out "jQuery Modile"
You can try iScroll 5 it's quite simple but do the trick perfectly.
You will find in the archive of the project an example of horizontal paging under demos/carousel, you will see it's quite good. :)
In addition you will be able to see all other things you can do with iScroll which should fit your demands.

iOS: CSS3 animation breaks scrolling on div

I'm developing a web-app, based on the Dribbble API. In this app I have a div which shows all comments with a max-height of 200px, so if there's more than 200px worth on comments, the div gets scrollable. So far so good, works as intended on iOS.
However, when I add a Scale transfrm to this div (to mimic iOS's folder opening animation), scrolling the div breaks entirely. You can see the live version here: http://maxsteenbergen.com/longshot/
Is this fixable by setting a a new style using jQ's webkitAnimationEnd or is this without solution?
EDIT: In the meantime I found that using two fingers to scroll the div works but obviously, this is not how it's supposed to work.
It's also worth noting that scrolling DIV's don't work on older versions of iOS - it might be worth having a look at iScroll.
You can implement native iOS UI and achieve much better UI feedback. especially on scroll view. To obtain data from Dribbble API you may use 3rd-party Dribbble iOS SDK: https://github.com/agilie/dribbble-ios-sdk

How to Automatically adjust TextArea Height in GWT or Smart GWT

I'm having a problem that others have talked about here. ie How to auto adjust TextArea Height. I saw this answer: Creating a textarea with auto-resize
but I was hoping someone here can translate how to do this in GWT or Smart GWT.
Take a look at SimpleLayoutPanel. It enables you to respond to the browser's resize events.
There's a dedicated sample in SmartGWT for this use case:
http://www.smartclient.com/smartgwt/showcase/#layout_form_filling
If you're using SmartGWT you should not introduce core GWT widgets without a good reason (and there isn't one here obviously).

Website admin panel with iPad support

We're building an admin panel for managing bookings and payments. I would like to use the style of Apple Mail on the iPad as it is clean, simple and user friendly. We are quite capable of building it but the question remains on scrolling content.
Image a Clients page. We'd want a list of clients on the left and onclick the content to load on the right. On iPad mail these two colums scroll independently. Yet to achieve this on our own pages I have found only a handful of inadequate solutions.
1.) Overflow content and two finger scroll
- no scrollbars
- not particularly user friendly
2.) JS libraries such as iScroll
- over complex and lacing in cross browser compatibility.
Thus any other simple ideas on how to do this. Would a good old fashioned frameset accomplish this goal?
What's wrong with two divs with overflow: auto;?

Resources