1

我正在做一个网站，我还有最后一件事要做。我正在尝试创建页面转换。过渡需要淡出并淡入下一页。我尝试了很多脚本，但无法让它们工作。我尝试了几个不同的插件，其中一个插件工作正常，但我的幻灯片没有显示出来。是否有任何简单的 CSS 代码或 JS 代码？我考虑过为 DIV 编写过渡 CSS 代码，但我不知道该怎么做。有什么简单的建议吗？

html代码：

 <body>
  <div class="navigation">
  <ul>
    <li><a href="/">Home</a><li>
    <li><a href="about">About</a></li>
  </ul>
 </div>

 <div id="FADE">
   <!----CONTENT THAT NEEDS TO FADE UPON CLICKING ABOUT US PAGE--->
 </div>
 </body>
4

1 回答 1

0

使用 jQuery，您可以使用.fadeOut()和.fadeIn()

对于 CSS：

很难确切地说它如何适合您的代码，但我建议只创建一个.fade覆盖整个页面的 div，您可以动态添加和删除以创建过渡。

.fade{
    position:fixed;
    z-index:100000;
    top:0;
    bottom:0;
    width:100%;
    background:#fff;
    opacity:1;
    transition:opacity 0.5s ease;
}

.fade.hidden {
    opacity:0;
    z-index:0;
    width:0;
}

然后你可以简单地切换“.hidden”类来显示过渡。这应该可行，但可能不符合您的想法。

于 2013-08-29T11:30:11.413 回答