Move Toolbar (blue backgound, title, back button, search button, etc) To Bottom Of Screen

16 views
Skip to first unread message

Haatch

unread,
Jan 2, 2010, 5:22:35 PM1/2/10
to iPhoneWebDev
Thank you to anyone who would like to help with this.

I am creating an iPhone version of my website and am using iui, my
question is how can I move the entire toolbar, like that at that at
the top of the music demo screen, to the BOTTOM of the iphone screen.
Is it possible to float it, or, if I contain the enitre page to
320x480, set the position to absolute or relative?

I want the look & feel of a native iPhone app with the black menu bar
& icons at the bottom of the screen.

Thanks again for any help!

-Haatch

anmldr

unread,
Jan 2, 2010, 11:14:28 PM1/2/10
to iPhoneWebDev
Since fixed positioning is not available in mobile Safari, it isn't
technically possible. But, you can have a page that has no scrolling
that is a given size and have the toolbar at the bottom of the page
absolutely positioned. If you need scrolling, here is a hack. It is
the only one that I know about.

http://cubiq.org/dropbox/iscroll/

I don't know if either of these will work with iUI though.

Linda

Remi Grumeau

unread,
Jan 3, 2010, 8:58:33 AM1/3/10
to iphone...@googlegroups.com
Hi,

I've made a few tests with iUI and homemade coding using JS events (onscroll + onresize)
http://remi-grumeau.com/labs/iui/bottom-menu.php
Guess what: it works perfectly under Safari … but only reload once scroll is finished on Safari Mobile
FAIL : /

So i start http://remi-grumeau.com/labs/iui/bottom-menu2.php, using a JS timeout.
and … FAIL again : (
Perhaps a Javascript guru could make this code work also while scrolling under Safari Mobile ?

iScroll seems … well … not that clean to me.

This example and related JS code is catching my interest more than iScroll
http://doctyper.com/stuff/iphone/fixed/
source: http://doctyper.com/archives/200808/fixed-positioning-on-mobile-safari/

Remi

> --
>
> You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group.
> To post to this group, send email to iphone...@googlegroups.com.
> To unsubscribe from this group, send email to iphonewebdev...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/iphonewebdev?hl=en.
>
>

Reply all
Reply to author
Forward
0 new messages