链接到外部网站时是否可以使用页面转换?

时间:2014-03-20 21:27:52

标签: javascript jquery css html5 css3

我的目标是拥有一个登录页面,当用户点击登录按钮时,该页面会通过不同的URL将它们带到Web应用程序。但是,我注意到页面上的多个div创建了整页转换(例如此http://tympanus.net/Development/PageTransitions/),而不是链接到不同的页面。小号

我的问题是,在使用CSS3链接分隔的页面时,我可以使用页面转换吗?或者我需要查看不同的代码以查看是否可能?

3 个答案:

答案 0 :(得分:1)

当您加载新页面时,您将丢失上一页中的所有内容 - HTML,CSS和任何脚本。因此,您无法在不同页面之间创建任何效果。

jQuery,GWT和其他一些框架允许您构建看起来好像用户从一个页面导航到另一个页面的应用程序(甚至URL更改),但实际上用户始终保持在同一主机页面上。在这种情况下,您可以创建不同的过渡效果。

答案 1 :(得分:1)

您可以加载外部网址after动画?

一些伪代码。

<a href="http://www.otherdomain" class="extlink">Click to other domain</a>

<script>
   /* listen for external link clicks */
   $(".extlink").on("click", function(e) {
     e.preventDefault();
     var _href = $(this).attr("href");

     /* if the animation accepts an 'onend' callback */
     _animation.on("end", function() { window.location.href=_href; });

     /* or if css3 anim/transition, time it to the same  */
     var animTimer  = setTimeout(function() { window.location.href=_href; }, 2000);
     /* 2000 being the settings of the anim/transition in the css */

   });

</script> 

我不知道你是如何进行页面转换的,但原理是这样的 - 在动画后调用外部网址。

答案 2 :(得分:1)

根据您来自tympanus.net的示例并考虑到您的网页在您的服务器上:

合并按钮点击

a)进行页面转换 b)通过ajax将新页面的内容加载到这些&#39;多个div中的一个&#39;你提到了