Question

这将检查是否在iFrame中加载了页面，如果没有，页面将重定向到另一个URL。非常难看，它仅在重定向之前显示该页面。我希望再进行一次更平滑的重定向。

<script>
function check_frame() {
     if( top === self ) { // not in a frame
          location.href = "/link/to/some/url"; // either the frameset or an error.
     }
}
</script>
<body onLoad="check_frame()">
... normal code for your page here ...
</body>

Answer 1

您可以使用css对不透明度为0的主体进行样式设置，并在检测到您位于框架内部之后，通过为其指定css类来将其设置为1。这种方法的附带好处是，如果您喜欢的话，可以使用过渡效果淡入内容。

您可以考虑使用location.href.replace，以便用户不会意外地结束单击后退按钮并在同一重定向循环中结束的情况。

此外，您可以考虑进行检查以确保您位于预期放入的同一帧中。毕竟，当前的测试只是确保您处于任意状态-即使它在其他人的网站上，例如堆栈溢出。

if (window.top === window.self) {
  location.href.replace("/link/to/some/url");
} else {
  document.body.classList.add('framed');
}

body {
  opacity: 0;
  transition: opacity 2s ease-in;
}
body.framed {
  opacity: 1;
}

<div>Your framed content</div>

有没有更好的方法来引起平滑的重定向？

1 个答案: