3

次のことについて初心者の頭を理解できないので、少しアドバイスが必要です。このフィドルを参照してください:http://jsfiddle.net/NtUpw/

コードは意図したとおりに機能しますが、現在の div オフセットが 41 を超えて prev がヒットした場合、ページを現在の div の先頭ではなく、その前の div の先頭に戻してください。この条件を追加するにはどうすればよいですか?

私は、現在のコードが最もクリーンではないことを認識しています (実際には、2 つのフィドルの組み合わせです)。ありがとう。

$('a.buttons').on('click', function (e) {
e.preventDefault();

var t = $(this).text(),
    that = $(this);

if (t === 'next' && $('.current').next('div.post').length > 0 ) {
    var $next = $('.current').next('.post');
    var top = $next.offset().top;

    $('body').animate({
        scrollTop: $('.current').next('div.post').offset().top - 40

    });

} else if (t === 'prev' && $('.current').prev('div.post').length > 0 ) {
    var $prev = $('.current').prev('.post');
    var top = $prev.offset().top;

    $('body').animate({
        scrollTop: $('.current').prev('div.post').offset().top - 40
    });
}



$(window).bind('scroll', function () {
    $('.post').each(function () {
        var post = $(this);
        var position = post.position().top - $(window).scrollTop();

        if (position <= 40) {

            post.addClass('current');
            post.prev().removeClass("current");

        } else {
            post.removeClass('current');
        }
    });
});
4

1 に答える 1

2

prev アクションは、常に div を前に移動することによって機能します。解決策は、現在のdivに対するナビゲーターの現在の位置を確認することです:

var $prev;
var top;

var firstElem = true;
if ($('.current').prev('div.post').length > 0) {
    $prev = $('.current').prev('.post');
    top = $prev.offset().top;
    firstElem = false
}

var currTop = $('.current').offset().top;
var navBottom = $('.navigation').offset().top + 40;

if (currTop == navBottom && !firstElem) {
    $('body,html').animate({
        scrollTop: $('.current').prev('div.post').offset().top - 40
    });

これにより、ナビゲーターは現在の最上部にない場合にのみ前の div にジャンプします。代わりに前にジャンプします。

Firefox の問題は、Firefox がオーバーフローを配置する方法に依存し、他のブラウザーとは異なるhtmlレベルに配置されます。body動作させるには、スクロール アクションを次のように定義する必要があります。

$('body,html').animate({

});

作業フィドル: http://jsfiddle.net/IrvinDominin/2QYgR/3/

于 2013-04-21T15:04:38.947 に答える