YouTube APIでSafari7系で自動再生させる。


coffeescriptでyoutube apiを叩いて動画を埋め込みつつ
Safari6〜7系で自動再生されないので調べたものをメモ。

$ = window.jQuery = require 'jquery'

module.exports =
class YouTube

  constructor: ->
    super
    tag = document.createElement 'script'
    tag.src = "https://www.youtube.com/iframe_api"
    firstScriptTag = document.getElementsByTagName('script')[0]
    firstScriptTag.parentNode.insertBefore tag, firstScriptTag

    @$youtube = @$ '.js-youtube'
    window.onYouTubeIframeAPIReady = @apiReady

  apiReady: =>
    window.player = new YT.Player @$youtube.get(0),
      width   : '640'
      height  : '390'
      videoId : 'M7lc1UVf-VE'
      events  :
        'onReady'       : @onPlayerReady
        'onStateChange' : @onPlayerStateChange
      playerVars :
        autoplay       : 1
        rel            : 0
        controls       : 0
        showinfo       : 0
        modestbranding : 1
        wmode          : 'transparent'
        html5          : 1

  onPlayerReady: (event) ->
    console.log 'ready'

  onPlayerStateChange: (event) ->
    console.log event.data

キモは

      playerVars :
        html5          : 1

だった。