Javascript Youtube-自定义播放图标

我想问一下，我是否可以改变Youtube视频播放图标？ 我发现这个帖子： 但这个按钮位于原始播放图标的顶部，所以如果我使用透明的东西，原始播放图标将可见

---

谢谢您的帮助。

我认为您无法更改实际按钮，但您可以解决此问题：

隐藏玩家

获取所描述的缩略图，并将其放在页面上与播放器相同的位置和大小

将自己的播放图标放在缩略图上

单击播放图标时，隐藏缩略图和播放图标，显示播放器，并使用链接中的YouTube API启动视频

//youtube脚本
var tag=document.createElement（'script'）；
tag.src=“//www.youtube.com/iframe_api”；
var firstScriptTag=document.getElementsByTagName（'script'）[0]；
firstScriptTag.parentNode.insertBefore（标记，firstScriptTag）；
var播放器；
onyoutubeiframeapiredy=函数（）{
player=新的YT.player（'player'{
高度：'244'，
宽度：“434”，
videoId:'AkyQgpqRyBY'，//youtube视频id
playerVars：{
“自动播放”：0，
“rel”：0，
“showinfo”：0
},
活动：{
“onStateChange”：onPlayerStateChange
}
});
}
var p=document.getElementById（“播放器”）；
$（p.hide（）；
var t=document.getElementById（“缩略图”）；
t、 src=”http://img.youtube.com/vi/AkyQgpqRyBY/0.jpg";
onPlayerStateChange=函数（事件）{
如果（event.data==YT.PlayerState.end）{
$（'.start video'）.fadeIn（'normal'）；
}
}
$（文档）。在（'单击'，'开始视频'，函数（）{
$（this.hide（）；
$（“#播放器”）.show（）；
$（“#缩略图_容器”）.hide（）；
player.playVideo（）；
});
。启动视频{
位置：绝对位置；
顶部：80px；
填充：12px；
左：174px；
不透明度：.3；
光标：指针；
过渡：均为0.3秒；
}
.开始视频：悬停
{
不透明度：1；
-webkit过滤器：亮度（1）；
}
div.u容器
{
宽度：434px；
高度：244px；
溢出：隐藏；
背景色：#000；
}
缩图
{
利润上限：-50px；
不透明度：0.5；
}

我想，这是唯一的方式。谢谢。不幸的是，player不能在移动浏览器上以编程方式播放。在不支持player.playVideo（）的浏览器（如iOS上的Safari）中无法工作。还有其他选择吗？如果是，我会更新我的答案