1
Dies kann eine offensichtliche Antwort haben, aber ich sehe es einfach nicht. Ich habe diesen Code aktualisiert, um den falschen top-Wert für article section h1 zu korrigieren. Ich fügte auch einen :hover Auslöser für article section h1 hinzu. Ansonsten ist dies der gleiche Code, den ich vom webdesigner magazine genommen habe, um einen animierten Titeleffekt zu demonstrieren, aber in FF oder Chrome passiert nichts. Ich habe dem Übergangsstil die Präfixe -webkit- und -moz hinzugefügt, aber immer noch nichts. Bitte sag mir, was ich falsch mache.css Übergang von einem Tutorial nicht funktioniert auch mit -webkit- und -moz- Präfixe
body,html {
\t display:block;
\t width: 100%;
\t height: 100%;
\t background: white;
\t color:black;
\t padding: 0;
\t margin: 0;
\t font-family: Helvetica, sans-serif;
}
nav {
\t position:fixed;
\t top: 0;
\t width: 100%;
\t z-index: 9999;
\t background: white;
}
article {
\t position: relative;
\t padding-top: 5em;
}
article section {
\t position: absolute;
\t opacity: 0;
\t width: 100%;
}
article section:target {
\t left: 0;
\t opacity: 1;
\t z-index: 9999;
}
article section h1 {
\t position: absolute;
\t top: 0em;
\t left: 0;
\t font-size: 4em;
\t width: 100%;
\t color:black;
\t
}
article section h1:hover {
\t text-shadow: 0 998em 2 em #000;
\t transition: text-shadow 1.5s;
\t -webkit-transition: text-shadow 1.5s;
\t -moz-transition:text-shadow 1.5s;
}
nav {
\t display:block;
\t width: 100%;
\t padding: 2em;
\t text-align: center;
}
nav a {
\t color: black;
\t text-decoration: none;
\t padding: 1em 2em;
\t margin-right: 1em;
}
nav > a:hover {
\t border-bottom: .5em solid #c00;
}<nav>
\t \t <a href="#first">Option</a>
\t \t <a href="#second">Option</a>
\t \t <a href="#third">Option</a>
\t \t
\t </nav>
\t
\t <article>
\t \t <section id="first">
\t \t \t <h1>First title</h1>
\t \t </section>
\t \t <section id="second">
\t \t \t <h1>Second title</h1>
\t \t </section>
\t \t <section id="third">
\t \t \t <h1>Third title</h1>
\t \t </section>
\t </article>
Ihre Geige ist defekt. Mit diesem CSS wird Ihre 'Sektion' nie erscheinen, so dass Sie den Übergang sehen können. Und deshalb sind deine wahren Absichten unklar. Bitte schreibe deinen Code neu, damit wir dir helfen können. – VictorGodoi