HTML-CSS：加载时奇怪的淡入

Question

我的主机上有直播 preview here。这个演示实际上只是一个完整的页面滑块，但是当我添加这些代码行时，它变成了一个更像淡入淡出的页面 'slider'。我发现所有其他文本在加载时很快就消失了，这很烦人吗？

 .fullpage-wrapper {
    width: 100%!important;
    transform: none!important;
}

    .fp-section {
        width: 100%!important;
        position: absolute;
        left: 0;
        top: 0;
        visibility: hidden;
        opacity: 0;
        z-index: 0;
        transition: all .7s ease-in-out;
    }

    .fp-section.active {
        visibility: visible;
        opacity: 1;
        z-index: 1;
    }

Answer 1

听起来你也需要对内容进行过渡。

所以如果你只有一个 h1。

像这样：

.fp-section h1 {
  transition: all .7s ease-in-out;
  opacity: 0;
}
.fp-section.active h1 {
  opacity: 1;
}

HTML-CSS：加载时奇怪的淡入

HTML-CSS: Strange fade in at load

jquery

html

css

fade

fullpage.js