0

動的な値、つまりscrollTop()とtext()を取得しようとしています-それらを配列に格納し、後でスクロールイベントで使用します。これまでのところ、これは最初の値を押しているように見えます。はるかに少ないコードを使用してこれを行う他の非常に効率的な方法があると確信していますが、私はこれにかなり慣れておらず、なぜそれが機能しないのかを理解しようとしています。どんな助けでも大歓迎です!サーミ人。

var $titleName = [];
var $titlePosition = [];

$('#section-title').each(function () {
    $titleName.push($(this).text());
});

$('#section-title').each(function () {
    $titlePosition.push($(this).offset());
});

$(window).scroll(function () {
    windowScroll = $(this).scrollTop();

    if (windowScroll >= $titlePosition[0].top) {
        $tooltip.text($titleName[0]);
    }

    if (windowScroll >= $titlePosition[1].top - 100) {
        $tooltip.text($titleName[1]);
    }

    if (windowScroll >= $titlePosition[2].top - 100) {
        $tooltip.text($titleName[2]);
    }

    if (windowScroll >= $titlePosition[3].top - 100) {
        $tooltip.text($titleName[3]);
    }
});

http://jsfiddle.net/userdude/sTNJM/

4

1 に答える 1

1

.section-titleIDは一意であるため、クラスに変更し$.map、配列に使用し、それぞれを繰り返してif条件を実行します。

var elem           = $('.section-title'),
    $titleName     = $.map(elem, function(el,i) { return $(el).text(); }),
    $titlePosition = $.map(elem, function(el,i) { return $(el).offset().top; });

$(window).on('scroll',function() {
    var windowScroll = $(this).scrollTop();

    $.each($titlePosition, function(i, pos) {
        var pad = i>0 ? 100 : 0;
        if ( windowScroll >= (pos - pad) ) $tooltip.text($titleName[i]);   
    });
});
于 2013-03-27T08:28:22.430 に答える