セクションを通過するときに関数を起動する - jquery

Question

私のコードの最後のビットを動作させるのに苦労しています。問題私は私のhtmlの構造は大体この

<div class="panel-grid-cell"> 
    <div id="pgc-1">...</div> 
    <div id="pgc-2">...</div> 
    ... 
    <div id="pgc-n">...</div> 
</div> 

のように見えたときにユーザーがスクロールdiv

過去のユーザーがid="pgc-1"火機能をdivを通過するときだから、アイデアがある機能を発射する必要がありますされます残りの部分についても同様です。

これらのdivのそれぞれが付属hrefとli aアイテムを持っているので、私は私の関数はthisがどのような瞬間にhref

でli aに対応することになる。この

ga('send','event','scroll',city,$(this).text()) 

ようになります私はこれがあります。 divをループし、id'sを配列に格納する関数です。そして、li aメニューをビルドします。

var li=""; 
var linames = ["Intro","1925","1935","1945","1955","1965","1975","1985","1995","2005","Now"]; 
var i = 0; 
function getSectionIDs() 
{ 
    $("div.panel-grid-cell").children().each(function() { 
    if(linames[i] !== undefined) 
    { 
     li += "<li><a href='#"+$(this).attr('id')+"'>"+linames[i]+"</a></li>";   
    } 
    i++; 
    }); 
$("ul.timeline-items").append(li); 
} 

は今、私はまた私がスクロールして、各li項目のクラスを変更でしたどこまでチェックする機能を持っています。

function onScroll(event){ 
    var scrollPos = $(document).scrollTop(); 
    $('ul.timeline-items li a').each(function() { 
     var currLink = $(this); 
     var refElement = $(currLink.attr("href")); 
     if (refElement.position().top -75 <= scrollPos && refElement.position().top+75 + refElement.height()-75 > scrollPos) { 
     $('ul.timeline-items li a').removeClass("active"); 
     currLink.addClass("active"); 
     } 
     else{ 
     currLink.removeClass("active"); 
     } 
    }); 
    } 
    $(document).on("scroll", onScroll); 

このコードは、私がdivに合格したりしていない場合、それは常にチェックしているため、私は、欲しいものはないが、私は一度だけ、私の機能を起動する必要があります。

助けが必要ですか？先日ソリューションを自分自身を発見

Answer 1

、スクロール機能インサイド

はちょうど$(document).scrollTop()がrefElement.offset()に等しいとき、条件を入れて機能を発射し、それが完璧に動作します。

ユーザーがスクロールした距離をチェックし、この値がdivのオフセットと等しい場合は、関数を起動します。