window.scrollTo not working in phonegap - alternative solution or workaround?

后端 未结 3 1452
我寻月下人不归
我寻月下人不归 2021-01-01 05:47

I\'ve written a rather basic js function that programatically and automatically aligns the iPhone keyboard perfectly underneath each and every input field t

相关标签:
3条回答
  • 2021-01-01 06:41

    you can try and use the animate and scrollTop property to scroll It looks something like this:

    $("html, body").animate({ scrollTop: "The value to scroll to" });
    

    Hope this helps.

    0 讨论(0)
  • 2021-01-01 06:42

    You just need to use this:

    $(window).scrollTop(0);
    
    0 讨论(0)
  • 2021-01-01 06:45

    After doing some research, I realized window.scrollTo() does actually work in iOS6 with phonegap 2.1, there was something else that failed; for some reason, document.height didn't yield a property of equal proportion within UIwebView so I had to write a small workaround. I'll post the solution and the entire code below for future reference.

    function setKeyboardPos(tarId) {
    
    //programmatically: set scroll pos so keyboard aligns perfectly underneath textfield
    var elVerticalDistance = $("#"+tarId).offset()["top"];
    var keyboardHeight = 157;
    
    if(isNativeApp()) { keyboardHeight = 261; } //I choose to change the keyboard height for the sake of simplicity. Obviously, this value does not correnspond to the actual height of the keyboard but it does the trick
    var keyboardTextfieldPadding = 2;
    var heightOfView = document.height;
    var inputHeight = $("#"+tarId).outerHeight();
    
    var viewPortSpace = heightOfView-keyboardHeight-keyboardTextfieldPadding; //180
    var verticalNewSroll = (elVerticalDistance+inputHeight)-viewPortSpace;
    if(verticalNewSroll<0) { verticalNewSroll = 0; }
    ////
    
    //OK, all done lets go ahead with some actions
    $("#footer").hide(); //hide footer so that the keyboard doesn't push it on top of textfield
    $("#containingDiv").css("bottom","0px"); //remove bottom space for footer
    window.scrollTo(0,verticalNewSroll); // perform scroll!
    
    }
    
    function isNativeApp() {
    
    var app = (document.URL.indexOf('http://') === -1) && (document.URL.indexOf('https://') === -1);
    if (app) {
        return true; // PhoneGap native application
    } else {
        return false; // Web app / safari
    }
    
    }
    
    0 讨论(0)
提交回复
热议问题