Skip to main content
removeu 14 caracteres do conteúdo
Fonte Link

Com a animação de fadeOut, você precisa alterar a classe que o elemento HTML está atribuído, de fadeIn para fadeOut. Para isso, você pode usar javascript.

function mudarClasse() {
    document.getElementById("fade").className = "fade-out"
}
#fade { transition: 2s; }
.fade-out { opacity: 0; }
.fade-in { opacity: 1; }
<p id='fade' class='fade-in'>Texto</p>

<button onClick='mudarClasse()' id="btn-fade">FadeOut<'>FadeOut</button>

Basta alterar de acordo com seu código, criar uma nova animação para o fade-out, etc.

Com a animação de fadeOut, você precisa alterar a classe que o elemento HTML está atribuído, de fadeIn para fadeOut. Para isso, você pode usar javascript.

function mudarClasse() {
    document.getElementById("fade").className = "fade-out"
}
#fade { transition: 2s; }
.fade-out { opacity: 0; }
.fade-in { opacity: 1; }
<p id='fade' class='fade-in'>Texto</p>

<button onClick='mudarClasse()' id="btn-fade">FadeOut</button>

Basta alterar de acordo com seu código, criar uma nova animação para o fade-out, etc.

Com a animação de fadeOut, você precisa alterar a classe que o elemento HTML está atribuído, de fadeIn para fadeOut. Para isso, você pode usar javascript.

function mudarClasse() {
    document.getElementById("fade").className = "fade-out"
}
#fade { transition: 2s; }
.fade-out { opacity: 0; }
.fade-in { opacity: 1; }
<p id='fade' class='fade-in'>Texto</p>

<button onClick='mudarClasse()'>FadeOut</button>

Basta alterar de acordo com seu código, criar uma nova animação para o fade-out, etc.

Fonte Link

Com a animação de fadeOut, você precisa alterar a classe que o elemento HTML está atribuído, de fadeIn para fadeOut. Para isso, você pode usar javascript.

function mudarClasse() {
    document.getElementById("fade").className = "fade-out"
}
#fade { transition: 2s; }
.fade-out { opacity: 0; }
.fade-in { opacity: 1; }
<p id='fade' class='fade-in'>Texto</p>

<button onClick='mudarClasse()' id="btn-fade">FadeOut</button>

Basta alterar de acordo com seu código, criar uma nova animação para o fade-out, etc.