iOS 7 Chrome – 当虚拟键盘弹出时,固定位置抽屉不会停留在底部

我有一个底部抽屉,它固定在底部.抽屉时,抽屉将向上滑动并显示更多内容.在iOS 7上,当用户点击输入标签或textarea标签时,弹出虚拟键盘.但是,当键盘弹出时,抽屉会跳到页面上,而不是粘到底部.请参见下图进行说明.

我首先在Safari上遇到了问题,但是当键盘打开时,我添加了以下代码将固定位置更改为绝对位置：

// Apple.Device detects if it is an apple device
if (Modernizr.touch && Apple.Device) {
    /* cache dom references */ 
    var $body = jQuery('body'); 

    /* bind events */
    $(document)
    .on('focus','input,textarea',function(e) {
        $body.addClass('fixfixed');
    })
    .on('blur',function(e) {
        $body.removeClass('fixfixed');
    });
}

CSS代码：

.fixfixed #drawer {
    bottom: 0;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    left: 0;
    right: 0;
}

此修复程序适用于iOS 7上的Safari,但它不适用于Chrome.此外,还有一个愚蠢的行为：

如果页面上有一个输入标签,并且我在iPad上点击它,则虚拟键盘打开,并且抽屉跳转.如果抽屉恰好碰到我点击的话,点击事件实际上会在抽屉上触发.这是为什么？

如何解决这个问题？ (我一直在搜索一段时间,但如何在iOS上调试Chrome？)

非常感谢您的帮助！

更新

我使用以下代码来检测iOS 7中是否为Chrome,如果是这样,当虚拟键盘启动时,我隐藏抽屉,并在虚拟键盘关闭时重新显示抽屉.

function iOSversion() {
    if (/iP(hone|od|ad)/.test(navigator.platform)) {
        // supports iOS 2.0 and later: <http://bit.ly/TJjs1V>
        var v = (navigator.appVersion).match(/OS (d+)_(d+)_?(d+)?/);
        return [parseInt(v[1],10),parseInt(v[2],parseInt(v[3] || 0,10)];
    }
}

var iosVersion = iOSversion();

if (navigator.userAgent.match('CriOS') && iosVersion[0] == '7') {
   $(document).hammer().on('tap',function(e) {
            $('body').addClass('chromefixfixed');
        })
            .on('blur',function(){
                body.removeClass('chromefixfixed');
            })
}

CSS代码：

.chromefixfixed #drawer {
    display: none;
}

仍然存在的问题是：如何让iOS 7上的Chrome在Chrome上运行(在键盘启动时不隐藏抽屉)？

谢谢您的帮助！