Scroll suave com animação - projeto base

Projeto base de página web HTML5 + CSS3 + JS com menu lateral responsivo, scroll suave (smooth scroll) na navegação e animação nas seções ativas da página.

O que é um projeto base?

Um projeto base é um projeto com a estrutura básica de arquivos e alguns componentes já integrados, prontos para você personalizar como quiser. São ótimos pontos de partida para começar seu website.

O que o projeto 'scroll suave com animação' oferece?

Este projeto base já vem pronto com o funcionamento de um menu que se adequa ao tamanho da tela do dispositivo em que o website foi acessado, com as interações de abertura e fechamento do menu definidas.

Além disso, os links do menu direcionam para seções correspondentes ao longo da página, com transição suave no scroll e animações em cada seção ativa.

O menu também suporta links externos.

preview

Organização dos arquivos

starter-smooth-scroll-animation/
├── img/                                -- pasta que contém todas as imagens
│   ├── logo.png
│   ├── menu-trigger-images.svg
│   └── content-1 ... content-3.svg     -- imagens-exemplo
├── scripts/
│   └── header.js                       -- interações no header responsivo
├── styles/
│   ├── content-2.css                   -- estilos e animação da section 2
│   ├── header.css                      -- estilos do header responsivo
│   ├── reset.css                       -- reset do browser
│   └── style.css                       -- folha de estilo principal
└── index.html                          -- home

Desenvolvido por

Habemus

License

Creative Commons Attribution License