2017-02-17 2 views
1

Я хочу, чтобы видео-цикл три раза.Как зацикливать видео только 3 раза

Я пробовал сделать цикл for, но это не сработало.

Кто-нибудь знает. У меня есть это видео HTML.

И этот JS

(function() { 
    Floating.setup({ 
     clicktag: dhtml.getVar('clickTAG', 'http://bandholmhotel.dk/da/book-stay'), 
     target: dhtml.getVar('landingPageTarget', '_blank'), 
     video: { 
      sources: dhtml.getVar('videoSources'), 
      poster: dhtml.getAsset(3), 
      clicktag: dhtml.getVar('clickTAG') 
     } 
    }); 

    Floating.init(); 

})(); 

вар Floating = (функция() {

var videoPlayer; 

var banner = dhtml.byId('banner'), 
    closeButton = dhtml.byId('closeButton'), 
    video = dhtml.byId('video'), 
    clickArea = dhtml.byId('click-area'), 
    lib = Adform.RMB.lib; 

function setup(settings) { 
    for (var prop in settings) { 
     if (_settings[prop] instanceof Object) { 
      for (var prop2 in settings[prop]) { 
       _settings[prop][prop2] = settings[prop][prop2]; 
      } 
     } else { 
      _settings[prop] = settings[prop]; 
     } 
    } 
} 

var _settings = { 
    clicktag: null, 
    target: null, 
    video: null 
}; 

function init() { 
    createVideoPlayer(); 
} 

closeButton.onclick = function (event) { 
    dhtml.external.close && dhtml.external.close(); 
}; 

clickArea.onclick = function() { 
    stopVideo(); 
    window.open(_settings.clicktag, _settings.target); 
}; 

function createVideoPlayer() { 

    var videoSettings = _settings.video; 

    videoPlayer = Adform.Component.VideoPlayer.create({ 
     sources: videoSettings.sources, 
     clicktag: videoSettings.clicktag, 
     loop: videoSettings.loop, 
     muted: videoSettings.muted, 
     poster: videoSettings.poster, 
     theme: 'v2' 
    }); 

    if (videoPlayer) { 
     videoPlayer.removeClass('adform-video-container'); 
     videoPlayer.addClass('video-container'); 
     videoPlayer.appendTo(video); 
    } 

    function landPoster() { 
     if(!lib.isWinPhone) { 
     videoPlayer.video.stop(); 
     } 
    } 

    videoPlayer.poster.node().onclick = landPoster; 

    if (lib.isAndroid && lib.isFF) { 
     lib.addEvent(video, 'click', function(){}, false); 
    } 
} 

function stopVideo() { 
    if (videoPlayer.video.state === 'playing') videoPlayer.video.pause(); 
} 

return { 
    setup: setup, 
    init: init 
}; 

})();

Я хочу, чтобы видео зацикливалось ровно 3 раза.

Как это сделать.

+0

Возможный дубликат [Ограничьте количество воспроизведения видео в формате HTML5] (http://stackoverflow.com/questions/30117677/limit-the-number-of-times-an-html5-video-plays) – randseed1724

+0

I Пробовал это, но не повезло. –

ответ

1

Ознакомьтесь со стандартным обработчиком событий onended элемента HTML5. Настройте простую функцию события JS с помощью целочисленного счетчика и используйте функцию pause элемента видео, когда счетчик достигает 3. Эта ссылка должна помочь!

https://www.w3schools.com/TAGS/av_event_ended.asp

Кроме того, я любопытный знать, почему именно вы хотите видео на петле только трижды ...

Во всяком случае, если функциональность несколько похожа на небольшой анимации (небольшого видео), который следует сыграть 3 раза, подумайте о создании анимации GIF с тремя жестко запрограммированными повторениями!

+0

Спасибо за помощь. Я хочу, чтобы это было слишком сложно, потому что это для добавления. –

+0

@ Jonathan Cool. Сделайте upvote и примите мой ответ, если идея обработчика события onended срабатывает! :П – varun

Смежные вопросы