JW Player从点击中寻找并暂停

时间:2015-08-12 00:08:15

标签: javascript onclick jwplayer seek

我需要使用jwplayer创建一个可以播放视频特定区域的视频播放器。我这样做是为了减少我们需要在页面加载时加载的视频量,并希望在以后需要调整时间时简化持续更新。我只想修改数据属性。

我不希望请求页面刷新或不同的视频。

目标:所需的行为是,按下按钮1,播放0-10秒并暂停。按下按钮2,播放11-20秒并暂停。点击第一个按钮并根据需要重复该行为。

按钮会像这样存在:

我做了一些代码更新,但功能并不完全正常。这只有在击中按钮两次后才有效...如果按下0-15,然后按15-25,则开始播放然后停止。我认为停止是由于在这种情况下停止我的呼叫造成的?

 <section>
    <div class="seeker" data-start="0" data-end="15">Go there and pause</div>
</section>
<section>
    <div class="seeker" data-start="16" data-end="20">Go there and pause</div>
</section>

 jwplayer("player").setup({
    file: "http://sample-videos.com/video/mp4/720/big_buck_bunny_720p_1mb.mp4",
 });
$(function(){
    $("section").each(function(){
        $(this).find(".seeker").bind('click',function(){
            var start = $(this).data('start'),
                end   = $(this).data('end');

            jwplayer().play();

            jwplayer().seek(start).onTime(function(event) {
                if(event.position>end) {
                 jwplayer().stop();
                }
            });

        });
    }); 

此代码适用于加载,因此功能无法正常工作,但我只需要附加到点击并使用&#39; start&#39;,&#39; end&#39;瓦尔。

        jwplayer().onReady(function(){ 
             jwplayer().seek(0).onTime(function(event) {
                 if(event.position>15) {
                     jwplayer().stop();
                 }
             });
        });

正在进行中的工作如下: http://jsfiddle.net/arkjoseph/n2rpq1t4/21/

0 个答案:

没有答案