In Firefox (v24), initialisation of keyboard jumps to top of the document

[harrywebdev]

Even with settings appendLocally: true (at first I thought it's issue due to appending to the body). Can check it on the demo page in Firefox v24
http://mottie.github.io/Keyboard/layouts.html

when changing the layout (and being scrolled down on the page), after initialisation it jumps back to top.

PS: thanks for great plugin! ;-)

[Mottie]

Hi @hery-potr! (I see what you did there! LOL)

I'm not sure what to tell you... I see the same problem in IE10, but not in Chrome. I'll have to do a bit more digging to find the source of this problem.

Thanks for reporting it!

Just tested with Firefox 25 and didn't notice any problem.

[harrywebdev]

Hi Mottie! :-))
Thanks!

@theplague Just tested in FF v25 (on Win) and still doing it, if you make your window smaller, scroll to the bottom and change the layout from selectbox, it flicks back to top - don't yours?

[Mottie]

Yeah, it's still happening to me too... I just haven't had time to figure out the problem - too many projects to juggle!

[foxdonut]

Experiencing this now... seeing the dates on those comments, is there any hope that this will get fixed? Thanks in advance... awesome plugin!

[Mottie]

Hi @foxdonut!

Try the plugin code within the working branch of this repository. It doesn't appear to be causing this issue any more.

Please note that you no longer need to destroy the plugin to change the layout - see issue #183 for the code and a demo.

[foxdonut]

Hi @Mottie!

Thank you for the suggestion! However, no luck. I still get the behaviour with the working branch.

But you might still be able to help. You see, I am not changing the layout of the keyboard. Instead, I am just dynamically adding a new section to the page (after clicking on a button), and the new section includes fields that use the keyboard. When I create a new keyboard with element.keyboard(config) in the new section, that's when the behaviour of jumping back to the top of the page occurs.

Any ideas?

Thanks again, I appreciate your help!

[foxdonut]

@Mottie : issue seems fixed if I replace this line:

        base.temp = $('<input style="position:absolute;left:-9999em;top:-9999em;" type="text" value="testing">')
            .appendTo('body').caret(3,3);

with this:

        base.temp = $('<input style="position:absolute;left:-9999em;top:-9999em;" type="text" value="testing">')
            .appendTo(el).caret(3,3);

Adding the element to the body is what makes the jump to the top of the page. Since that element is temporary and gets removed after anyway, I added it to the current element instead, preventing the jump.

Thanks again for responding. Hope this helps!

[Mottie]

Hey @foxdonut!

Thanks for sharing, I'll test it out!

[Mottie]

Ok, I think it's fixed now. I completely removed the absolute positioning, which I think was the main culprit. and instead added a div with no width or height with an input inside.

I appreciate the help in narrowing down the problem!

[foxdonut]

Thanks @Mottie ! I'll test it out when it is merged to master. Thank you for this great plugin!

[Mottie]

Ok, this should be fixed in 1.19.0. Thanks for your patience!