4

I was wondering if it was possible to stop the page from scrolling using javascript when a user type or clicks on a <input type="text"></input>

3 Answers 3

2

So I figured out how to accomplish this, and I will leave this as a record for anyone else who needs to solve this problem. (NOTE : this solution has only been tested on safari and Firefox)

for:

<input id="text" type="text" />

the function

document.getElementById('text').onkeydown = new function(event){return false}

Will not cause the window to shift the scroll so that a user can see the input field when he types into the field. If like me you want this to happen for some letters but not for others simply edit the contents of the onkeydown function so that it returns false for certain keycodes and true for others.

Sign up to request clarification or add additional context in comments.

Comments

1

I faced up with similar problem. Try to use following solution: subscribe on focus event, disable window scroll in it's handler and turn scroll on by timeout.

I know solution seems not very clean, but demo looks nice, without visual defects.

$(function() {
    var oldScroll = window.onscroll;
    $(document).on('focus', 'input', function(e) {
        window.onscroll = function () { 
            window.scroll(0,0); 
        } ;
        setTimeout(function() {
            window.onscroll = oldScroll;
        }, 100);
    });

});

http://jsfiddle.net/N4da4/8/

Comments

0

You could possibly set the scrollTop property to x every n milliseconds. The problem with that approach I would think would be that the page would look jerky (technical term) when the user attempted to scroll the page.

Besides, you'd be breaking the expectations of the user that they be able to scroll the page at any time which I would recommend against as it could confuse them at best and annoy them at worst.

1 Comment

Yeah i though of this, but i would not look nice for the user. I was hoping to disable the browser function that automatically focuses the text field.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.