具有自定义开始和结束时间的YouTube iframe的自定义进度栏

Question

我正在尝试使用不同的开始和结束时间（默认的开始和持续时间除外）创建自定义的YouTube进度栏，原因是我只想显示一部分视频，而且用户也不能录制整个原始视频。供参考的网站是：https://tutorialzine.com/2015/08/how-to-control-youtubes-video-player-with-javascript

我以1秒的间隔使用此代码来更新进度条，它是范围输入。

<input type="range" id="progress-bar" value="0" />

function updateProgressBar(){
    // Update the value of our progress bar accordingly.
    $('#progress-bar').val((player.getCurrentTime() / Session.get('customEndTime') * 100);
}

但是，这没有用，因为它需要从player.getCurrentTime（）中获取当前时间，而实际上我希望它从0开始或最左端，因为我想让它看起来像是从头开始播放。 >

假设我的开始时长为10，结束时长为60。如何显示进度条，以便它给出一个百分比，并且随着播放器进度的增加而增加。

我正在尝试使用不同的开始和结束时间（默认的开始和持续时间除外）创建自定义的YouTube进度栏，原因是我只想显示视频的一部分，而且也要显示......]

Answer 1

[我尽了最大的努力来注释代码，但是类似的东西应该可以工作。技巧实际上就是将min的max和input设置为type='range'。

我还参数化了每个函数-我发现参数化的函数扩展性更好。。