Airplay与自定义html5控件

有没有人知道是否有办法让Airplay在使用CUSTOM CONTROLS的 html5视频上工作？这是重要的部分,我意识到如果你使用内置的html5控件,你可以只添加x-webkit-airplay =“allow”属性.但我的视频播放器使用自定义控件.

似乎Safari会将Airplay按钮放在内置的html5控件上,但如果我不使用内置控件,有没有办法做到这一点？这是我写的html5播放器的链接.请注意底部的控件是我自己的：

http://pluralsight.com/training/Player?author=keith-brown&name=aspdotnet-security&mode=live&clip=0&course=aspdotnet-security

谢谢！

解决方法

这里好消息！该功能已在Safari 9中实现.

Safari 9.0 allows you to create custom controls for HTML5 media with JavaScript AirPlay support. Use Safari’s WebKitPlaybackTargetAvailabilityEvent to detect Airplay availability and then add your own controls for streaming audio and video to AirPlay devices.

通过. What’s New in Safari 9

这是HTML5 video и кнопка для AirPlay的一个例子

// Detect if AirPlay is available
// Mac OS Safari 9+ only
if (window.WebKitPlaybackTargetAvailabilityEvent) {
    video.addEventListener('webkitplaybacktargetavailabilitychanged',function(event) {
        switch (event.availability) {
            case "available":
                AirPlayButton.show();
                break;
            default:
                AirPlayButton.hide();
        }
        AirPlayButton.on('click',function() {
            video.webkitShowPlaybackTargetPicker();
        });
    });
}

原文地址：https://www.jb51.cc/html5/240985.html