3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

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

Posted at

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

だった。

3
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?