两个单独的 html 文件之间的平滑幻灯片过渡答案

【问题标题】：Smooth slide transition between two separate html files两个单独的 html 文件之间的平滑幻灯片过渡
【发布时间】：2015-08-14 15:42:20
【问题描述】：

是否有可能在两个单独的 html 文件之间进行平滑的幻灯片转换？比如说。在一个 html 上是

<a href="secondHtml.html">Link</a>

点击此链接后页面并没有重新加载，只是滑动到第二个文件？

【问题讨论】：

您好，如果我的回答可以解决您的问题，请接受。谢谢

标签： javascript jquery html ajax slide

【解决方案1】：

您必须通过 ajax 将第二个 HTML 文件加载到 iFrame 或 DIV 中，然后将其滑动到视图中。您可以为此使用 jQuery 并轻松访问动画。

您可能还想更新页面的 URL，因为您可以使用 location.hash 来完成此操作，而无需重新加载页面。您还可以检查 observehashchange plugin for jquery 以在用户更改 URL 时检查哈希更改。

您可以查看示例here。

要让 Google 访问这些网页，您可以在您的网站上添加 sitemap.xml 来描述这些网页，并且您可能还需要设置 webmaster tools 以向 Google 提供有关您网站的有用信息。在这里你可以添加链接，谷歌会得到它。我有一个页面，Google 可以看到超过 5000 个链接，但默认情况下它们不在任何页面上。

但是如果你想在你的页面上有正常的<a>链接，你可以使用一个简单的jQuery来触发动画而不是去链接。

<a href="/page2">Go to page 2</a>
<a href="/page3">Go to page 3</a>
<a href="/page4">Go to page 4</a>
<script>
    function LoadPage(page) {
        //Put your page loader script here        
    }

    $(document).ready(function(){
        $(a).click(function(event){
            event.preventDefault();
            var page = $(this).attr('href').substr(1);
            LoadPage(page);
        });
    });
</script>

【讨论】：

嗨 Fenistil，对不起，我没有回答错误。问题在于你的解决方案，然后第二个 html 没有放在所以......谷歌不会看到它。
@user3510022：我已经用必要的信息更新了我的帖子。