Strumento Javascript per le applicazioni a pagina singola tour guidato

Question

Ho visto una volta uno strumento javascript (plugin jquery forse) per implementare funzionalità di funzionalità/guida tour, sfortunatamente non ho aggiunto la pagina ai segnalibri.

Ha utilizzato un overlay e si è concentrato sugli elementi del documento, in base agli attributi id probabilmente.

Joyride o qualsiasi cosa che ho trovato googling non supporta questa.

Avete qualcosa in mente?

Answer 1

jquerypowertour.com possono evidenziare elementi e molto altro ancora. Non l'ho usato, ma sembra piuttosto potente.

Ma penso che qualcosa di simile al JoyRide o Guiders-JS potrebbe essere facilmente modificato per fare in combinazione con jQuery Highlighter plugin - Demo

Answer 2

Sideshow è una biblioteca moderna e potente per la creazione di percorsi interattivi per le applicazioni web e siti.

Più che guida i tuoi utenti, Sideshow può interagire con loro:

• Evidenziare la parte si sta parlando in ogni fase (una forma, div, immagine, campo, e così via), per mascherando il resto dello schermo (Sideshow non usa l'approccio z-index per questo, la sua maschera non è posizionata dietro l'elemento, ma lo circonda davvero).
• Controlla il comportamento dell'utente e lo stato di alcuni schermi.
• Crea passaggi intelligenti per i tuoi tutorial, che procedono automaticamente quando alcune condizioni sono soddisfatte
• Crea relazioni tra le tue esercitazioni, in questo modo, quando l'utente termina alcuni tutorial, viene visualizzato un elenco con i relativi tour.
• Usa Markdown per ricchi formattazione di una descrizione passo
• utilizzare gli eventi (ad es beforeStep/AfterStep, beforeWizardStarts/afterWizardEnds) per eseguire una certa preparazione o qualsiasi altra cosa
• Mostra tutorial contestuali a seconda della schermata viene visualizzata dal tuo utente, ogni tutorial ha le sue condizioni per verificare se è idoneo per quella schermata o no

E altre potenti funzionalità!

Answer 3

Intro.js è un'introduzione migliore per siti Web e funzionalità con una guida passo-passo per i vostri progetti.

Caratteristiche:

• tastiera + mouse di navigazione
• veloce & Piccolo
• Browser Compatibllity
• libero & Open-Source