文章/答案/技术大牛

发布

社区首页 >问答首页 >jquery如何延迟每个克隆视频的播放

问jquery如何延迟每个克隆视频的播放
EN

Stack Overflow用户

提问于 2020-01-29 20:02:33

回答 1查看 167关注 0票数 0

我想做一个视觉效果播放同一个视频一次多次，但有一点延迟他们。第一个视频将在开始时播放，其余视频将以级联方式播放，每个视频都有1000个延迟，因此最后一个将播放克隆视频x1000的数量。

但我不能为每个克隆人延迟播放。只需暂停或同时播放所有这些内容。我遗漏了什么？

    <body>
    <div class="masonry-css" id="gridVideos">
    </div>
    <script type="text/javascript">
        var cloneCount = 1;
        var count = 0;
        $.fn.multiply = function (numCopies) {
            var newElements = this.clone(true, true);
            for (var i = 1; i < numCopies; i++) {
                count++;
                newElements  = newElements.add(this.clone(true, true)
                                          .attr('id', 'Videos' + cloneCount++)
                                          .insertAfter($('[id^="gridVideos"]:last'))
                );
            }
            return newElements;
        };
        var repeVideos = $('<video/>', {
            'id': 'myVideo',
            'class': 'masonry-css-videos',
            'width': '320',
            'muted': 'true',
            'loop': 'true',
            'src': 'videos/AVIDEAlow.webm',
            'type': 'video/webm',
        });
        var repetimos = $('<div/>', {
            'id': 'Videos0',
            'class': 'masonry-css-item',
        });
        var todoDivsVideo = repetimos.append(repeVideos);
        $('#gridVideos').append(todoDivsVideo.multiply(9));
        $('video').trigger('pause');
        $('[id^="Videos"]').find('video').each(function(){
                        setTimeout(function(){$('video').trigger('play');
                         });
                        });

settimeout

clone

delay

jquery

video

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-01-29 20:05:04

jQuery中.each()的第一个参数是当前索引，因此可以使用index * 1000在循环期间递增延迟

第二个参数是当前元素，因此您也可以使用它来代替video选择器

$('[id^="Videos"]').find('video').each(function(index, video) {
  setTimeout(function() {
    $(video).trigger('play');
  }, index * 1000)
});

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/59966690

复制

相似问题

问jquery如何延迟每个克隆视频的播放
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery如何延迟每个克隆视频的播放EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery如何延迟每个克隆视频的播放
EN