JavaScript (JS)


  • Efeito Rolagem Suave ao Clicar em Botão com JavaScript (Smooth Scroll JS)

    Para fazer um efeito de rolagem suave ao clicar em botão, é possível usar o javascript, com apenas um código curto e simples. Para isso, adicione este código JS abaixo em sua página: Depois, apenas precisa colocar a class .ancor em seus botões, como exemplo abaixo: Atualização: 29/02/2024 Caso sua página use a mesma CLASS […] ... Continue a ler.

  • Animação Fade com Scroll da Pagina usando CSS + JS

    Esse código permite que você crie uma animação em qualquer conteúdo HTML onde o efeito “fade” suave é aplicado para mostrar o conteúdo que fica escondido por padrão assim que você “rola” (scroll) a pagina. Alem disso, esse código permite que o efeito se repita caso o usuário suba a pagina e desça novamente. Veja […] ... Continue a ler.

  • Slide CSS + JS simples com Slick JS

    Com a biblioteca do Slick JS você pode criar um slide de imagens ou HTML facilmente em qualquer site. Você pode achar mais informações e a documentação completa sobre a biblioteca do Slick JS acessando https://kenwheeler.github.io/slick/. ... Continue a ler.

  • Gerar numero aleatório e armazenar em uma sessão com JavaScript

    O código abaixo possibilita criar um numero aleatório para a pagina em questão e depois salva esse mesmo numero em uma sessão do navegador. Assim, quando a pessoa carregar a pagina vai verificar o mesmo numero mesmo atualizando a pagina. Já outra pessoa que abrir, verá outro numero. ... Continue a ler.

  • Efeito Fade Up com delay suave pelo Scroll via CSS e JS

    Se você está procurando uma maneira de melhorar a experiência do usuário no seu site, o efeito Fade Up com delay suave pelo Scroll pode ser uma ótima opção. Combinando técnicas de CSS e JavaScript, esse efeito cria uma transição suave entre as seções do seu site, tornando a navegação mais agradável e intuitiva. Neste […] ... Continue a ler.

  • Botão salvar evento no calendário com JS (JavaScript)

    Precisa criar um botão para que o usuário adicione um determinado evento do site em sua agenda? Então este post pode lhe ajudar. Este projeto open-souce pode trazer a solução para o seu problema: https://add-to-calendar-button.com/ Veja um exemplo abaixo de integração simplificada: Exemplo funcionando em: https://botao-salvar-evento-no-calendario-js.brunoalbim.repl.co/ Espero que este post tenha lhe ajudado. Um forte […] ... Continue a ler.

  • Redirecionamento de pagina com JavaScript

    Aprenda a redirecionar um visitante para outra pagina depois de um certo período de tempo usando apenas JavaScript. Veja o exemplo abaixo: O código acima realiza uma contagem regressiva, previamente configurada para 10 segundos neste exemplo, e depois redireciona o usuário para a pagina ou site em questão. Você pode modificar o código como quiser […] ... Continue a ler.

  • Fazer div aparecer/desaparecer ao rolar (scroll) a pagina com JS e CSS

    Aprenda a fazer uma seção (div) aparecer ou desaparecer ao rolar (scroll) a pagina, apenas com javascript e CSS com este código simples. HTML de exemplo: JavaScript: CSS: OBS: Este código usa jQuery para funcionar. ... Continue a ler.

  • Obter div especifica de outra pagina ou site com iframe via jQuery JS

    No exemplo abaixo, vamos trazer um formulário de login de um site fictício para nosso site. OBS: Caso você esteja obtendo essa DIV de um domínio externo, ele pode ser bloqueado pela politica CORS (Cross-Origin Resource Sharing). Caso tenha autoridade sobre esse domínio, defina a permissão de acesso para o seu site. ... Continue a ler.