H5 开发相关资料

[hanyuxinting]

[某些技巧]（https://www.jianshu.com/p/bc5a5387f056）

H5上达到原生的滚动效果

处理方法， 对需要滚动的组件使用CSS属性

.scrollPart {

-webkit-overflow-scrolling: touch;

}

当虚拟键盘弹出的时候，window的resize事件会被触发。 监听input元素的focus事件，以及window的resize事件。因为focus事件将在resize事件前触发。然后通过scrollIntoViewIfNeeded使输入框可见。

var inputs = document.getElementsByTagName("input");
for (var i = 0; i< inputs.length; i++) {
    inputs[i].onclick = function (e) {
        window.setTimeout(function () {
            e.target.scrollIntoViewIfNeeded();
        }, 0);
    }
}

if (/Android/gi.test(navigator.userAgent)) {
    window.addEventListener('resize', function () {
        if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
            window.setTimeout(function () {
                document.activeElement.scrollIntoViewIfNeeded();
            }, 0);
        }
    })
}

h5设置键盘为搜索类型

是输入法根据表单元素自己做的识别。你把你的input type 设为 search，就可以了。 然后在css上设置 -webkit-appearance: none; 去除搜索输入框特有的样式。