Intro.js: l'area evidenziata non funziona come previsto

Question

Sto utilizzando la libreria javascript molto interessante intro.js.

Tuttavia, nella mia applicazione, l'area highligted diventa quasi completamente bianca.

Immagino che questo sia un conflitto CSS, ma cosa posso fare per determinare la causa di questo problema?

Answer 1

non ho visto alcun jsFiddle o qualsiasi esempio on-line del vostro problema, ma cerco di rispondere alla tua domanda in questo modo:

1. E 'Sembra che si sta utilizzando un'altra libreria di interfaccia utente come ExtJS o qualcosa del genere, assicurati di non avere conflitti CSS.
2. cercare di cambiare data-intro e data-step in un altro elemento, per esempio se la società avete la data-intro e data-step nell'elemento form, cambiamento ad un elemento superiore o un div.

Answer 2

In Introjs.css, l'impostazione di z-index su 1 per la classe introjs-helperlayer risolve questo problema. Tuttavia, non conosco la piena implicazione di questo cambiamento.

Answer 3

Ho impostato la posizione dell'elemento di destinazione su assoluto (nel CSS corrispondente) e ora funziona! vedere qui - http://prntscr.com/1dl0db

Answer 4

Si sta tentando di evidenziare una Riga tabella()? Se è così, anch'io ho avuto questo problema. Qualcuno ha postato una correzione nella sezione dei problemi di github: https://github.com/usablica/intro.js/issues/146

Answer 5

Questo è comune per gli utenti che utilizzano l'elemento di riga della tabella. Risolvo il mio aggiungendo queste righe al css.

.introjs-relativePosition > td { position: relative; } 
.introjs-showElement > td { z-index: 9999999 !important; }