Question

我有3 Scrollify个部分。我滚动到第2部分时尝试播放视频，并在滚动到第1或第3部分时暂停播放。

HTML

data-div-name="first"

data-div-name="second"

data-div-name="third"

JS

before: function(first) {
    $("#video").get(0).pause();
},

before: function(second) {
    $("#video").get(0).play();
},

before: function(third) {
    $("#video").get(0).pause();
},

看起来我的功能覆盖的可能是因为我没有正确地索引这些部分。任何帮助将不胜感激。

谢谢，

Answer 1

您可以询问滚动哪个部分是当前的播放/暂停 -

before: function() {
    if($.scrollify.current().hasClass('second')){
        $("#video").get(0).play();
    } else {
        $("#video").get(0).pause();
    }
},

演示 - http://codepen.io/dmoojunk/pen/KWNZXG

我不认为scrollify的工作方式与您使用部分名称的方式相同，但如果您想使用这些数据属性，则可以执行类似的操作 -

if($.scrollify.current().attr('data-div-name') === 'second'){

Answer 2

$(function() {

  $.scrollify({
     section:".spot",
     scrollSpeed:800,
     before: function() {

         if ($.scrollify.currentIndex() == 2){

           console.log('start');
           // Your actions...

         } else {

           console.log('end');
           // Your actions...
         }
       }
   });

在特定的Scrollify部分运行代码

2 个答案: