Question

I am building an application that will be primarily used on the Samsung Galaxy Tab. There is a long form in the app. The form takes up the entire screen of the tablet, so when a field is selected – half of the form is covered by the keyboard. I want to be able to Scroll the WebPage right to where the input field they have selected is.

I have tried 2 solutions:

1

var href = window.location.href;
href = href.split("#")[0];
href = href + '#' + element.id;
window.location.href = href;

[2]

jQuery Plugin: jQuery.ScrollTo

Both of these solutions work great on desktop/laptop browsers, but they don’t seem to have any effect in the Galaxy tablet browser. Anyone have any ideas?

Answer 1

First, I would try $(htmlInputSelector)[0].focus() method on a given html element.

If that doesn’t work, try:

    var myJqObj = $(htmlInputSelector);
    var hTop = myJqObj.offset().top;
    var hLeft = myJqObj.offset().left;
    window.scrollTo(hLeft, hTop);