页面到页面转换

时间:2016-11-01 16:53:58

标签: javascript html

我有两个不同的页面。 的index.html page2.html

我在index.html上有一个按钮,它会将我们带到page2.html, 但它直接过渡。当我第一页切换到第二页时,我正在寻找一个淡入淡出过渡的地方。

我不必回到第一页,因此我们不需要从第二页到第一页的任何转换。

有人可以帮忙吗? 谢谢

1 个答案:

答案 0 :(得分:1)

有三种方法可以真正实现这一目标。如果浏览器在地址栏中加载新页面,除了在新页面上使用淡出和淡入外,您无法从一个页面转换到另一个页面。但是,还有另外两种方法可以使页面加载动画运行。第一个是完全不可取的,因为它使用iframe并且可以使框架与其加载的页面之间的通信复杂化。

以下是三种算法:

  1. 首次加载页面时,在“body”元素上添加淡入淡出动画,并通过javascript触发页面上的所有链接。调用Javascript导航功能时,淡化页面,然后在动画回调上执行位置更改。由于所有页面都有fadeIn,因此页面显示为“正在转换”。

  2. (不建议) - 迭代ID并在每个新请求上,在所有内容上方加载隐藏的iframe,并为其提供递增的ID。在创建框架之前,还要对框架应用onLoad处理程序,并在框架加载时对其进行动画处理。

  3. 使用AJAX将内容加载到容器中,您可以根据ajax请求何时开始并获得响应来设置动画。

  4. 我假设你在寻找算法,而不是代码样本。因此,措辞。