Question

我有一个有多个循环视频的div。为了提高性能，我暂停了视频，直到他们使用以下代码滚动到视口中：

 jQuery(window).on("load resize scroll",function(e){
        if (jQuery('#vid-container').visible(true)) {
               start_vid(); 
        } else {
            jQuery('iframe[id*="fitvid0"]').each(function () {
                 $f(this).api('pause');
            });
        }
    });
});

function start_vid(){
    jQuery('iframe[id*="fitvid0"]').each(function () {
                $f(this).api('setVolume', 0);
                $f(this).api('play');
            });
}

这样可行，但由于每个视频iframe具有相同的ID，因此一旦＃vid-container 进入视图，它们就会同时开始播放。

我试图找出一种方法，我可以将每个视频iframe 单独定位，这样他们就会逐渐开始播放视图不同时。

类似的东西：

if (jQuery('#vid-container child2, #vid-container child3, #vid-container child4, #vid-container child5').visible(true)) {
start_vid();
}

希望有意义..谢谢

ps我使用jquery.visible插件和vimeo api

Answer 1

检查start_vid()功能中的可见性。

function start_vid(){
    $f('iframe[id*="fitvid0"]').each(function () {
        if ($f(this).visible(true)) {
            $f(this).api('setVolume', 0);
            $f(this).api('play');
        }
    });
}

Jquery - 单独定位多个子div不同时

1 个答案: