5

我希望对图像和无限滚动使用 LazyLoad 技术将新内容加载到我的页面中。这两件事都利用$(window).scrollTop()了 Facebook 画布应用程序内部不起作用的功能。我知道我可以FB.Canvas.getPageInfo()用来获取当前的 scrollTop 值但是我遇到了一些性能问题，我的代码如下：

var oldScroll = 0;       // current scroll 
var newScroll = null;    // new scroll (fetched from FB.Canvas)

// Override the normal function to work within fb
// !!This seems to kill the browser
$.fn.scrollTop = function() {
    return FB.Canvas.getPageInfo().scrollTop;  
};

// poll to check for any changes in scroll
setInterval(function() {
    newScroll = FB.Canvas.getPageInfo().scrollTop; 

    if(oldScroll != newScroll) {     // have we scrolled at all?
        oldScroll = newScroll;
        $(window).trigger($.Event('scroll'));   // fire a scroll event to keep the rest of the application that is listening
    }
}, 1000);

如果我不覆盖 scrollTop 函数似乎很好，但是一旦我这样做，我的浏览器很快就会崩溃。

我会完全错了吗？是否有人已经在 FB 画布中创建了一种方法来执行此操作？干杯。

4

2 回答 2

2

我试图解决同样的问题，我的解决方案是 Facebook 应用程序 + setInterval 中的一个附加元素（div#xscroll，pos:abs，L）：

function wininfo() {
    FB.Canvas.getPageInfo(
        function(info) {
            $('#xscroll').height(info.clientHeight+info.offsetTop+info.scrollTop).trigger('scroll');
        }
    );
};

现在您可以将此#xscroll 用于LazyLoad：

$(".img").lazyload({threshold:400,effect:"fadeIn",skip_invisible:true,container:'#xscroll'});

问题是 - FB.Canvas.getPageInfo 时 CPU 使用量很大，我的间隔是 2000 - CPU 使用率很高。经过一个小时的脚本工作 - Safari 速度变慢并且内存泄漏......

于 2012-01-30T17:39:10.893 回答
1

您是否坚持要scrollTop()覆盖该功能？最初它适用于您通过 jQuery 选择器提供的任何元素，而您似乎将其限制为仅 facebook 画布。如果任何其他 javascript 尝试使用scrollTop()，它会惨遭失败，不是吗？

至于解决方案，我以几乎相同的方式进行了无限滚动——setInterval()看看你是否已经到达底部，然后加载内容，然后再次检查滚动，等等。但我不会在任何时候触发窗口的原始滚动事件，因为没有必要 - 至少在我的情况下。

于 2011-12-21T13:50:03.247 回答