OSXのsafariのみif文が正常に動作しない

Question

###実現したいこと
YouTubeAPIで動画を埋め込み、ブラウザのwindow幅で動画を切り分けたい

###発生している問題
OSXのsafariのみ常に動画ID2が表示されてしまう（Chrome等では動作確認済み）

###ソースコード

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

var windowWidth = window.innerWidth ? window.innerWidth: $(window).width()
var breakWidth  = 768;

if(windowWidth > breakWidth) {
	function onYouTubeIframeAPIReady() {
		player = new YT.Player('player', {
			height: '450',
			width: '800',
			videoId: '動画ID1',
			wmode: 'transparent',
			events: {
				'onReady': onPlayerReady,
				'onStateChange': onPlayerStateChange
			},
			playerVars: {
				"rel":0,
				"showinfo":0
			}
		});
	}
} else {
	function onYouTubeIframeAPIReady() {
		player = new YT.Player('player', {
			height: '315',
			width: '560',
			videoId: '動画ID2',
			wmode: 'transparent',
			events: {
				'onReady': onPlayerReady,
				'onStateChange': onPlayerStateChange
			},
			playerVars: {
				"rel":0,
				"showinfo":0
			}
		});
	}
}

色々と調べてみたのですが原因がわからず。。
ご教授いただけますと幸いです。よろしくお願い致します。

Answer 1

if文の中で関数宣言をしてるからですね
ブラウザごとに挙動が違うようですので、その方法はやめておいたほうが良いと思います

var onYouTubeIframeAPIReady = function() {

と無名関数を代入する形にしてはどうでしょうか

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions_and_function_scope#Conditionally_defining_a_function

Comments

[kjhy]

ご回答ありがとうございます。無事正常に動作するようになりました。