DataZombies / jQTouch

jQT extensions jqt.activityIndicator, jqt.bars (with numeric badges), jqt.checkGroup & jqt.segmentedControl.Get updates via Twitter http://twitter.com/HeadDZombie. If you find this fork useful please make a donation via PayPal (http://tinyurl.com/2fpmx27). See below for demo links.
MIT License
159 stars 34 forks source link

on device tabbar size and position #4

Closed l0c0luke closed 13 years ago

l0c0luke commented 13 years ago

Looks and works great in the browser as far as creating the height and position. I slam that same code onto my device/simulator and it seems the tabbar moves down off the screen where I cannot read the text. Additionally the wrapper height is like 25 pixels too short and you can see a blank area at the bottom of the scroll wrapper as the contents move past. My current work around is to change the #tabbar height to 4.0375 (or around there) and then add another 25 to the wrapper height in the setHeight function.

DataZombies commented 13 years ago

jqt.tabbar is designed for full-screen mode on simulator/device. Did you add your app to the simulator’s home screen or view it in mobile safari? What iOS is the simulator using? I have a G5 iMac. So I can only run the iOS 2.x simulator. In that simulator the tabbar doesn't get drawn correctly.

l0c0luke commented 13 years ago

running as an app using PhoneGap running xcode 3.2.4. Same results regardless of SDK being used.

Interestingly, as I try and make sure I am giving you good info, I reload my page on my device (3gs) in safari and the tabbar starts in the middle of the page, looking to be the height of the URL/search thing at the top of Safari. But this would make sense if as you say it is intended to run in full screen mode.

janierdavila commented 13 years ago

Same here. I created a sample app with a UIWebView and the issue continue. Same with PhoneGap. The tabbar is showing only half of it and you can only see the image, not the wording. Incidentally, l0c0luke's workaround worked for me too, but I am not sure if it's the correct way or if I am braking something else...

I'm new here and I see no way to attach a screen shot; but also my wrapper is like 20-25px short...

Thanks

giuliano commented 13 years ago

I encountered the same phonegap issue and I solved it with this snippet of js code: if (typeof(PhoneGap) != 'undefined') {$('body > #tabbar').css({bottom: '20px !important'});}

DataZombies commented 13 years ago

Thanks giuliano. That line can go in jqt.bar's CSS section.