2012-06-17 16 views
8

Sto usando il componente dell'interfaccia utente di Gantt Chart dhtmlx che ha un elenco di attività e grafico. Elenco attività e grafico sono contenuti in due elementi div separati che sono sincronizzati per lo scorrimento parallelo. Scorrendo l'area del grafico, l'elenco delle attività viene fatto scorrere automaticamente in modo che la posizione della riga di attività corrisponda alla posizione della linea di Gantt.Perché a volte scrollTop/scrollLeft non può essere scritto?

Ispezione del codice sorgente del componente, ho trovato la sincronizzazione è attuato dal seguente codice:

this.oData.onscroll = function() { 
    self.panelTime.scrollLeft = this.scrollLeft; 
    self.panelNames.scrollTop = this.scrollTop; 
}; 

markup HTML nel controllo dell'interfaccia utente sono generati dinamicamente da JavaScript. Tutto funziona bene, tranne che impiega troppo tempo per visualizzare l'elenco delle attività 800-ish.

Per migliorare il tempo di rendering, ho deciso di creare il mio modulo di rendering lato server per generare il codice HTML identico a quello del lato generato in origine. Questo markup è recuperato dal lato client usando ordinaria jquery $ .get() e iniettato alla pagina usando $ (el) .html(). Quindi ho inserito il gestore di eventi necessario come versione del lato client originale.

Il problema ora è lo scorrimento parallelo non funziona. Potrei catturare l'evento di scorrimento nell'area del grafico, ma non è stato possibile impostare la proprietà scrollTop dell'area dell'elenco delle attività. Eseguo il test in firebug per forzare manualmente la proprietà scrollTop, ma il valore non è cambiato. Sembra che la proprietà scrollTop sia di sola lettura.

C'è qualche spiegazione per questo?

risposta

9

Non è possibile scorrere in basso (o oltre la parte destra) del contenuto dell'elemento. Se l'elemento ha overflow: visible (il valore predefinito), o è grande almeno quanto il suo contenuto, allora entrambe le proprietà di scorrimento saranno bloccate a 0. Analogamente, anche se c'è qualcosa di nascosto da scorrere nella vista, non sarà possibile scorrere oltre la fine; se si imposta scrollTop o scrollLeft su un valore maggiore rispetto a quello desiderato, esso diminuirà fino al valore più grande che ha senso.

La mia ipotesi è nel tuo caso stai provando a far scorrere il div prima che il suo contenuto sia caricato, e si rifiuta di scorrere perché non c'è nulla da scorrere nella visualizzazione.

+0

Grazie per la spiegazione. Penso di avere un elemento miss-placed in modo che la proprietà scrollTop vada al div sbagliato. –

Problemi correlati