在特定的 Scrollify 部分运行代码答案

【问题标题】：run code on specific Scrollify section在特定的 Scrollify 部分运行代码
【发布时间】：2017-03-07 21:27:17
【问题描述】：

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

html

data-div-name="first"

data-div-name="second"

data-div-name="third"

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

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

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

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

谢谢，

【问题讨论】：

标签： jquery html scroll html5-video jquery-scrollify

【解决方案1】：

您可以询问 scrollify 哪个部分是当前的并从中播放/暂停 -

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'){

【讨论】：

谢谢，这是一个更好的方法和一个优雅的解决方案:)
你是对的，我认为我使用的部分不正确

【解决方案2】：

$(function() {

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

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

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

         } else {

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

【讨论】：