Question

我正在开发一个Facebook应用程序，并遇到了一个小问题。在进行ajax调用时，我想让用户知道应用程序正在加载。

我的困惑是，其他人说facebook不允许GIF动画，但上面的应用程序有一个GIF动画。我仔细检查了他们的源代码无济于事。任何关于如何在Facebook应用程序中播放GIF动画的想法都会很棒。

<script type="text/javascript">
function search_ajax()
{
    document.getElementById('loading').setStyle('display', 'block');
    var ajax = new Ajax();
    ajax.responseType = Ajax.FBML;
    ajax.ondone = function(data) {
        document.getElementById('search_results').setInnerFBML(data);
        document.getElementById('loading').setStyle('display', 'none');
    }
    var queryParams = { "VSearchMake" : document.getElementById('VSearchMake').getValue(),
    "VSearchModel" : document.getElementById('VSearchModel').getValue(),
    "VSearchYear" : document.getElementById('VSearchYear').getValue(),
    "VSearchPrice" : document.getElementById('VSearchPrice').getValue(),
    "ShowNewUsed" : document.getElementById('ShowNewUsed').getValue()   };
    ajax.post('http://domainname/facebook/results.cfm', queryParams);
}

</script>

<img src="http://domainname/images/loading.gif" id="loading" style="display:none;" />

Answer 1

你的意思是动画蓝条？我敢打赌，这不是一个动画GIF，但有些JavaScript的东西还在继续。鉴于我已经在很多网站上看过它，我会在Facebook API中寻找相应的JS功能。很抱歉没有给出更完整的答案，但也许这会指向正确的方向。

Answer 2

我在我的应用中使用了GIF动画。基本上你在图像标签中设置gif并在页面加载时最初隐藏它，如下所示：

<img src="http://example.com/images/mygif.gif" style="display:none;" id="wait">

当发送ajax请求时，您取消隐藏图像：

document.getElementById('wait').setStyle('display', 'block');

一旦你从ajax获得成功回应，你就会再次隐藏它：

document.getElementById('wait').setStyle('display', 'none');

<强>更新

您没有隐藏它，请改用此代码：

ajax.ondone = function(data) {
    document.getElementById('search_results').setInnerFBML(data);
    document.getElementById('loading').setStyle('display', 'none');
}

Facebook应用程序＆amp;动画加载Gif

2 个答案: