如何进行页面转换

use*_*242 5 html transition css-transitions

我正在创建一个网站,我想这样做,如果你点击页面底部的按钮,你会转到一个新的.html文件,其中包含不同的布局,但我希望它看起来像新的页面正在滑动它看起来像一个很酷的过渡.

这是一个例子:

<!DOCTYPE html>
<html>
<body>

    <p>Create a link of an image:
        <a href="default.asp">
            <img src="smiley.gif" alt="HTML tutorial" width="32" height="32">
        </a>
    </p>

    <p>No border around the image, but still a link:
        <a href="default.asp">
            <img border="0" src="smiley.gif" alt="HTML tutorial" width="32" height="32">
        </a>
    </p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

我需要这样做,以便当你点击图片时它会转到一个新页面,但当它进入那个新页面时,会有一个"向上滑动"过渡.

谢谢!

And*_*kin 0

我不确定标准导航是否可行。一些应该可行的选项:

  1. 使用 JavaScript 进行导航(将所有内容放在同一页面上或通过 AJAX)
  2. 将所有内容放在同一页面上并使用:targetCSS 过渡

对于选项 1,如果您使用历史记录 API,您仍然可以在浏览器中拥有合理的 URL。