Como aplicar efeitos no menu fixo somente após o scroll no Elementor

Neste vídeo, vou te mostrar como aplicar diversos efeitos no menu fixo somente após o scroll do usuário, como mudar a cor do menu, mudar a cor do logo (SVG), fazer o menu aparecer somente após o scroll e mais alguns macetes.

Capítulos do vídeo:
00:00 - Introdução
00:23 - Fixando e configurando o menu
00:55 - Colocando cor no menu ao fazer scroll
02:45 - Colocando efeito de vidro (blur) no menu
03:47 - Mudando a cor do menu e dos elementos ao fazer scroll
07:06 - Diminuindo o tamanho do menu ao fazer scroll
08:02 - Fazendo o menu aparecer somente após a rolagem
09:03 - Diminuindo o tamanho do logo ao fazer scroll
09:31 - Encerramento - INSCREVA-SE e deixe o seu like :)

[wagnerrx]

Eu fiquei feliz por esse conhecimento passado aqui e nós proporcionar a liberdade criatividade com simplicidade. 🙏🎆✨🚀

[ricardocorrea]

Passando aqui pra agradecer pelo seu conteúdo, Cipa! Participei das lives de LPV e foram sensacionais as aulas. Desde então, estou sempre assistindo seus vídeos aqui e encontrando a mesma forma simples e objetiva de ensinar detalhes muito relevantes e que fazem diferença no trabalho com o Elementor! Sem contar o bom humor e a simpatia, que também fazem toda diferença. Valeu, mestre!

[marcelcarvalho]

Cipa, já sou fã das suas lives, mas esses conteúdos fixos são perfeitos! Você é top mestre.

[catiagraciele]

Caraca vc é muito bom nisso poxa não perco seu lançamento por nada

[thairincksilva]

po você tá dominando bem o css.. parabéns cipa!!

[mateusmteles]

Sempre agregando valor pra gente! Vlw demais cipa S2

[DanielCastroVilela]

Cipa sempre salvando a gente nos projetos! hahaha

[thiagosa]

Como faria para que ao rolar a página ele alterasse a opção do menu de acordo com o ancora . Ex: tenho uma âncora de biografia que está lá em baixo .. ao ir rolando ele vai mostrando no menu todos as âncoras e quando chegar n BIOGRAFIA ele já estaria selecionado no menu

[victorborgesfurtado]

Cipa, acho que vale um reels ensinando esse botão animado

[lucascaldas]

ótimo video Cipa! ao invés de aplicar no menu, tentei aplicar os efeitos de scroll no rodapé mas não consegui :( me ajuda nessa!!!

[MegaSites]

Parabéns pelo conteúdo muito bem explicado, porem tenho uma duvida no meu caso preciso diminuir a imagem que seria o logo, dentro do código altero de svg para png por exemplo?

Orgulhoso demais de ser seu aluno, Cipa!!! 🙏🤜🤛

[willianprado]

Simplesmente o Saytama das landing pages

[rafaelmartinssantos]

Boa noite professor. Porque não aparece essa opção (Superior/inferior) no efeitos de movimentos depois que eu mudei pra Flexbox Container? Só aparece essa opção quando o Flexbox Container não está ativo. O que eu faço pra resolver?! Obrigado

[atallym]

O meu só funcionou no Firefox. No Chrome os efeitos não aparecem.

[jeh.s.oliveira]

Oi, só me esclarecendo então todos estes efeitos aplicados no menu são com o elementor free? apenas com cidgo CSS?

[oluanmontenegro]

Eu q fui a inspiração desse vídeo q eu sei kkkk

[gustavodias]

eu to usando o Container e os códigos de efeito blur nunca funcionam

[alexandreinacio]

Cara pena que esse botão de like só pode ser apertado uma vez. Gratidão

[rshenrique]

Cipa, você é o cara! Eu usei esse codigo do video para deixar fixo o menu de uma pagina que estou fazendo e tambem ter o efeito de blur. Mas esta ocorrendo o seguinte problema: toda vez que eu redimensiono o navegador a barra do menu fica com o tamanho igual ao ultimo tamanho da tela do navegador. Sabe porque isso acontece e como resolver? OBS: Quando eu removo o codigo CSS a barra do menu não da problema.