0

例のページは、FF と Chrome ではほとんど期待どおりに機能しますが、Safari では機能しません。いくつかの位置の変更があります (固定から静的に戻って固定に戻る) が、Safari に位置付けに関する問題 (非モバイル サファリ) があることは認識していません。以下は私のコードです:

$(function(){
    var footerPos = function () {
        var w = $(window).height();
        var top = (w-110);
        $('footer').css('top', top);
    };
    $(document).ready(footerPos);
    $(window).resize(footerPos);
    $('footer').waypoint(function(direction) {
        if (direction === 'down') {
            $('footer').css({'position':'static'}).animate({'height':'600px', 'top':'auto'}, 400, footerPos) ;
            $('.tfContent').css({'height':'200px'});
            $('p.extra').fadeIn('fast');
            $('#arrow').addClass('arrowDown');
            console.log('down');
        } else if (direction === 'up') {
            $('.tfContent').css({'background':'white'});
            $('footer').css({'position':'fixed','top':footerPos});
            $('.tfContent').css({'height':'60px'});
            $('p.extra').slideUp('fast');
            $('#arrow').removeClass('arrowDown');
                console.log('up');
        }
        }, { offset: 'bottom-in-view' });

最初に Chrome を見ると、ページの一番下までスクロールすると、白いコンテンツ (「.tfContent」) が下に展開され、「フッター」が固定位置から静的位置に変わり、高さが増加することがわかります。しかし、サファリではありません。何か案は?また、ウェイポイント機能でページを一番下までスクロールさせる方法はありますか? これは、何らかの理由で機能しません

$('html, body').animate({scrollTop: $(document).height()-$(window).height()}, 1400, "easeOutQuint");
4

1 に答える 1

0

特定のコードに対する答えはありませんが、一般に、fixed位置要素をウェイポイント (footerここ) として使用しても、期待どおりに動作しません。ウェイポイントは、ドキュメントに対する要素のスクロール位置を見ることで機能し、固定位置の要素は常にその点で変化しています。

于 2013-05-19T17:24:37.597 に答える