iOS 7 – 修复虚拟键盘上的页脚工具栏中断

我创build了一个在浏览器中运行并提供聊天支持的应用程序。 这是用于桌面和移动，并显示为一个固定的页脚。

在桌面上，一切正在工作，看起来不错，但是当它碰到移动时，我看到一个奇怪的问题。

当我不在页面的顶部并打开键盘时，一切正常。

但如果我靠近页面的顶部，则工具栏会中断，并出现在页面的上半部分：

我发现下面的链接，其他人提到它，但我不能隐藏页脚，因为我需要显示： http : //forum.jquery.com/topic/how-to-set-footer-fixed-at-bottom-even -如果虚拟键盘，是开

任何关于如何解决这个问题的build议是非常好的，我读到iOS增加了对固定位置的支持，但是对于这种情况似乎被打破了（打开网页顶部的虚拟键盘）。

这是我的代码：

#gc_toolbar_layout { ... position: fixed; word-break: keep-all; word-break: break-word; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } 

谢谢。

Answer 1

令人难以置信的哈​​克修复：

 $(document).on('focus', 'textarea', function() { $("#gc_chat_layout").css({position: 'relative', float: 'right', bottom: 'auto'}); $(document).scrollTop($(document).scrollTop()); }); $(document).on('blur', 'textarea', function() { $("#gc_chat_layout").css({position: 'fixed', float: 'none', bottom: '0'}); }); 

当我们不在页面顶部时，我们只能看到上述问题。 这基本上把你立即扔到页面的顶部。

我们添加了一些JavaScript代码来处理这个问题，把旧的位置保存在一个variables中，然后把它移回到那里。