Adicione etapas do progresso aos formulários com este jQuery Plugin

A maioria de nós sabe sobre as barras de progresso e como elas funcionam no design da interface do usuário. Eles ajudam a definir tempos de carregamento de páginas, formulários de upload e períodos similares de atraso entre páginas.

Mas etapas de progresso são um pouco diferentes. Estes funcionam como breadcrumbs no topo da página para guiar os usuários através de um processo passo-a-passo (geralmente formulários de inscrição e check-out).

Com jQuery Steps você pode adicione rapidamente etapas de progresso personalizadas em qualquer página do seu site.

O plugin inteiro é executado no jQuery e é liberado gratuitamente no GitHub.

Você pode rodar estes etapas de progresso como recursos de várias páginas que orientam o visitante através de diferentes páginas no seu site. Ou você pode executar isso como um passo Ajax que move o usuário através da mesma página com campos de formulário dinâmicos.

Nas opções do plugin, você encontrará configurações para alterar o “começar” posição, rodapé botões, frente / trás botões, e muito mais.

Há também alguns eventos que você pode segmentar com suas próprias funções de retorno de chamada personalizadas sempre que o usuário avança na etapa de progresso ou sempre que o usuário chega ao final.

Tudo considerado, este é um plugin relativamente novo não tem uma tonelada de opções para escolher. Mas é definitivamente um dos melhores plugins que você encontrará para criar esses recursos personalizados de etapa de progresso.

Basta observar: o suporte ao navegador é limitado principalmente aos navegadores modernos e, para os navegadores da Microsoft, isso só foi testado no IE 11. Se você deseja oferecer suporte a navegadores mais antigos, precisará fazer alguns testes sozinho ou tentar criar métodos de fallback para lidar com usuários herdados.

Certamente um dos plugins passo mais fáceis de progresso que eu já vi e deve ser legal com outros plugins jQuery também.

Dê uma olhada rápida na página inicial de uma demonstração ao vivo, juntamente com as opções JS personalizadas e um botão de download para obter uma cópia do código para você.