手机端页面开发注意事项

页头部分的设置

    <!--使用chrome 的内核渲染-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <!--移动平台缩放控制-->
    <meta  name="viewport"  content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <!--手机点击数字禁用打电话-->
    <meta name="format-detection" content="telephone=no" />

一些动画的处理

        //图片动画元素
        var player = document.getElementById("imgPlayer");
        //html5 音乐播放元素
        var audio = document.getElementsByTagName("audio")[0];
        //音乐播放完毕
        audio.ended = function () {
            player.style.animationPlayState = "paused";
        };
        player.addEventListener("touchstart", function (e) {
            if (audio.paused) {
                audio.play();
                //开始动画
                this.style.animationPlayState = "running";//兼容性不是特别的好

            } else {
                audio.pause();
                //停止动画
                this.style.animationPlayState = "paused";//兼容性不是特别的好
            }
        }, false);