webkit-playsinline && playsinline="true"

• 小窗播放 使視頻不脫離文本流追他，但是需要webview（allowsInlineMediaPlayback = YES webview.allowsInlineMediaPlayback = YES）阶淘，現(xiàn)在結(jié)果是蘋果支持，安卓不支持哼御。安卓播放會全屏佳鳖。

x-webkit-airplay="allow"

• 允許airplay（通過AirPlay可以把當(dāng)前的視頻投放到支持此技術(shù)的其他設(shè)備上泵殴。）

x5-video-player-type="h5"

• 通過video屬性“x5-video-player-type”聲明啟用同層H5播放器
• x5-video-player-type支持的值類型：h5
• 這個屬性需要在播放前設(shè)置好，播放之后設(shè)置無效

x5-video-player-fullscreen="true"

• 視頻播放時將會進入到全屏模式单寂，如果不申明此屬性贬芥，頁面得到視口區(qū)域為原始視口大小(視頻未播放前)，比如在微信里宣决，會有一個常駐的標題欄蘸劈，如果不聲明此屬性，這個標題欄高度不會給頁面尊沸，播放時會平均分為兩塊（上下黑塊）
• 注： 聲明此屬性威沫，需要頁面自己重新適配新的視口大小變化〗飞ィ可以通過監(jiān)聽resize 事件來實現(xiàn)

window.onresize = function(){
    test_video.style.width = window.innerWidth + "px";
    test_video.style.height = window.innerHeight + "px";
}

x5-video-orientation控制橫豎屏

• 聲明播放器支持方向
• 可選值： landscape 橫屏壹甥，portrain豎屏； 默認portrain
• 跟隨手機自動旋轉(zhuǎn)

<video x5-video-player-type="h5" x5-video-orientation="landscape|portrait"/>

方法

自動播放

setTimeout(function () { video.play(); }, 1000);
video.addEventListener('touchstart', function () {
    video.play();
});

進入全屏狀態(tài)

video.on('x5videoenterfullscreen', function() {
    //延時修改video尺寸以占滿全屏
    //$(this).attr('x5-video-player-type','');
    setTimeout(function() {
        $('video').css({
            width: window.innerWidth,
            height: window.innerHeight,
        });
    }, 200);
});

退出全屏狀態(tài)

//退出全屏狀態(tài)
video.on('x5videoexitfullscreen', function() {
    //清除
    $(this).css({
        width: '',
        height: '',
    });
});

控制video同層播放位置

video {
    object-position: 0 0;
}

獲取視頻緩存進度

function gp() {
    var _this=video;// video為當(dāng)前video元素
    var percent=null;
    // FF4+, Chrome
    if (_this && _this.buffered && _this.buffered.length > 0 && _this.buffered.end && _this.duration) {
        percent = _this.buffered.end(0) / _this.duration;
    }
    // Some browsers (e.g., FF3.6 and Safari 5) cannot calculate target.bufferered.end()
    // to be anything other than 0. If the byte count is available we use this instead.
    // Browsers that support the else if do not seem to have the bufferedBytes value and
    // should skip to there. Tested in Safari 5, Webkit head, FF3.6, Chrome 6, IE 7/8.
    else if (_this && _this.bytesTotal != undefined && _this.bytesTotal > 0 && _this.bufferedBytes != undefined) {
        percent = _this.bufferedBytes / _this.bytesTotal;
    }
    if (percent !== null) {
        percent = 100 * Math.min(1, Math.max(0, percent));
        return percent;
    }
    return 0;
}