内容加载顺畅，怎么做？

Question

我不确定如何引用这个（所以我不能自己搜索它），但是如何实现平滑的页面加载（类似于内容预取），就像你点击代码页链接一样在github中或当你点击Google plus侧边栏的另一个元素时？

我的意思是：我认为它是javascript和ajax的东西，但我无法弄明白，页面加载顺畅而没有“清爽”的感觉，而且肯定不会闪现。

如果我不清楚，我很抱歉，如果这不起作用，我会尝试更好地解释

Answer 1

Ajax + Jquery是我的赌注 加载页面的基础。然后执行Ajax调用以检索数据和Jquery的转换（？），以使GUI更新不那么笨重。

微软有一些新鲜的东西，如果你在堆栈上，他们会调用Single page application。

Answer 2

实际上很简单。
发出一个AJAX请求并显示一个加载器 将响应放在隐藏元素中并使用JQuery淡化它。

$("#id").fadeIn();

一定会感觉顺畅!!

Answer 3

如果您无法使用Ajax来访问页面内容，而html5在点击某些内容时更改了URL，则可以让页面快速淡出，然后转到URL（而不是使用链接）使用JavaScript函数将所有内容淡出，然后更改window.location）

加载页面后，您可以再次快速淡入。这将使您的过渡与谷歌的过渡类似，您将避免“白色闪光”

Answer 4

有多种方法可以实现这种效果，但一个相当简单的方法是使用jQuery（http://jquery.com/）和jQuery UI选项卡插件（http://jqueryui.com/demos/tabs/）。请查看该页面上文档的ajax模式部分。

如果您使用的是ASP.NET Web窗体，则还可以选择使用UpdatePanel（Introduction to the UpdatePanel control）。

Answer 5

我相信Facebook这样的网站，我猜是你所指的那种网站，使用iFrames加载内容，然后获取内容并将其转移到另一个元素。这意味着他们不会不断地重新加载左侧菜单，页眉或页脚以及您保持显示的任何聊天。

我个人刚刚开发了一个表格，当你向下滚动时会加载额外的行（类似于Facebook的新闻源，虽然我怀疑他们使用的是表格）。我只是将新行加载到一个隐藏的表中，一次30行，然后将行传输到原始表中。它与上述原理相似。

Answer 6

正如Anirudh Rayabharam所说，使用jquery动画可以很容易地定位要加载的元素。您可以将一个类添加到要滑入页面onload的所有内容中，并使用 $('.load-animation').slideDown(200);
您可以使用以下代码来确保动画开始加载： document.onload = function() { $('.load-animation').slideDown(200); }