將jQuery函數綁定到自定義事件監聽器

Question

我有點擊時觸發的jQuery代碼。但我需要它被定製的inview事件（由jquery.inview庫提供）解僱。

的代碼（這是上點擊射擊）：

$(document).ready(function(){ 
var split = $("[class^='splitText'],[class*=' splitText']").splitText({ // animation options go here }); 
$("#letters").on('click',function(){ 
    split.animate(); 
}); 
$("#words").on('click',function(){ 
    split.animate(); 
}); 
$("#lines").on('click',function(){ 
    split.animate(); 
}); 
$("#reverse").on('click',function(){ 
    split.reverse(); 
}); 
$("#type").on('change',function(){ 
    var value = $(this).val(); 
    var opts = { // another animation options go here }; 

    if(value == 'lines'){ 
     opts.animation = 'slide'; 
    } 
    split = $("[class^='splitText'],[class*=' splitText']").splitText(opts); 
}); 
}); 

我試着這樣做：

$(document).ready(function(){ 
var split = $("[class^='splitText'],[class*=' splitText']").splitText({ // animation options go here }); 
$("[class^='splitText'],[class*=' splitText']").on('inview', function(event, isInView) { 
    if (isInView) { 
    // element is now visible in the viewport 
    split.animate(); 
    } else { 
    // element has gone out of viewport 
    split.reverse(); 
    } 
}); 
}); 

但它不工作。

我錯過了什麼，如何在inview上激發代碼？

Answer 1

感謝注意力和時間在此花費，我已經找到了解決辦法：

jQuery(document).ready(function($){ 

var split = $("[class^='splitText'],[class*=' splitText']"); 
var opts = {'type':'letters','animation':'explode','useLite':true}; 

$("[class^='splitText'],[class*=' splitText']").each(function(){ 
$(this).on('inview', function(event, isInView) { 
if (isInView) { $(this).splitText(opts).animate(); } 
else { $(this).splitText(opts).reverse(); } 
    }); 
    }); 
});