Skip to content
aaronoliver edited this page Oct 27, 2011 · 6 revisions

A JavaScript helper is included in the boilerplate with namespace MBP, it's located at js/mylibs/helper.js. There are a couple of kick-ass functions that help you to improve mobile user experience.

iPhone Scale Bug Fix

Description:
MBP.scaleFix is used to fix the iPhone reflow scale bug, read more about it here: a fix for iphone viewport scale bug
Usage:
MBP.scaleFix();

###Hide URL Bar Description:
MBP.hideUrlBar is used to hide the URL bar at the top of mobile Safari on your iOS. Mobile space is limited and this helps to leverage every pixel on the screen to maximize display area.
Usage:
MBP.hideUrlBar();

###Fast Buttons (only use this if you only target webkit browsers, we are still testing out cross-browser support) Description:
MBP.fastButton is used to make instant responsive buttons, 300ms faster to be exact. (It uses touchstart to detect click event.)
Usage:
new MBP.fastButton(document.getElementById("myBtn"), function() {alert("clicked")});

###Autogrow textarea Description:
MBP.autogrow is used to make textarea to grow its height while you are entering more lines of text.
Usage:
var lineHeight = 14; new MBP.autogrow(document.getElementById("myBtn"),lineHeight);

###Splash Screen Description:
iOS and iPad both can use splash screen, but the dimensions are different, MBP.splash is used to auto detect the browser used to render the page and set the corresponding splash screen.
Usage:
new MBP.splash();