HTML5 Canvas Javascript Position Fix Needed - iPad, iPhone, Android

I have a plugin called "Fancy Product Designer," which is a t-shirt type of designer tool. This plugin uses the Canvas element to create product designs. The canvas includes a text field that is editable by a user. When the text field is double clicked to edit, the canvas re-centers in the browser, hiding the text element under the keyboard that pops up on the mobile device (iPhone, iPad, Android.) The person cannot see what they are typing because it is hidden. See attached photo (the text field is below the keyboard.) Can you fix this so that the canvas element does not move when the text is selected and edited? Or, is there a way to force the text field to be a certain amount of pixels from the top of the browser so that it can be seen above the keyboard on a mobile device?