0

示例页面在 FF 和 Chrome 中几乎可以正常工作，但在 Safari 中则不然。有一些位置变化（从固定到静态再到固定），但我不知道 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”）向下扩展，“页脚”从固定位置变为静态位置并增加其高度。但不是在 Safari 中。有任何想法吗？ALSO：有没有办法让页面在航点功能中滚动到底部？这由于某种原因不起作用

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

1 回答 1

0

我对您的特定代码没有答案，但通常使用fixed位置元素作为航点（footer此处）不会按您期望的方式工作。Waypoints 通过查看元素相对于文档的滚动位置来工作，并且固定位置的元素在这方面总是在变化。

于 2013-05-19T17:24:37.597 回答