Começando

Inclua o jQuery e os arquivos do plugin Material Walkthrough

Prepare seu HTML

Você não precisa de nenhuma marcação especial. Tudo o que você precisa é um atributo id em um elemento HTML.

                               Testar Agora!
                            

Chame o Plugin

Agora chame a função inicializadora do Material Walkthrough e seu walkthrough estará pronto.

                               $.walk([
                                        {
                                            target: '#passo1',
                                            content: 'Aqui você poderá começar o Walkthrough!',
                                            color: 'red',
                                            acceptText: 'OK'
                                        }
                                ]);
                            

A função Walk

A função $.walk(), possui 2 parâmetros:

Os Objetos

O 1º parâmetro será um array de objetos

Estes objetos possuirão os seguintes atributos:

• target: A query do elemento que será destacado pelo Walkthrough.
• content: O texto que será informado para o usuário. Você poderá inserir elementos HTML como <‍a>,<‍b>,<‍u>.
• [color]: A cor que este passo do Walkthrough terá. Poderá ser informado via Name, RGB ou Hexadecimal. Mais informações: Tutorial de Cores. Aconselhamos o uso de Cores Flat. Padrão: rgb(33, 150, 243)
• [acceptText]: Um texto curto para compor o botão de compreensão. Padrão: "OK"

Função Callback

O 2º parâmetro é opcional, será uma função callback para ser executada no término do Walkthrough

Licença

Copyright 2017 Esset Software LTDA.

Você deverá utilizar o projeto Material Walkthrough sob a Licença Apache, versão 2.0. Você pode obter uma cópia da Licença em

Licença Apache 2.0