Estoy usando el componente de interfaz de usuario Dutmlx Gantt Chart que tiene una lista de tareas y un gráfico. La lista de tareas y la tabla gráfica están contenidas en dos elementos div separados que se sincronizaron para el desplazamiento paralelo. Al desplazarse por el área del gráfico, la lista de tareas se desplaza automáticamente y la posición de la fila de tareas coincide con la posición de la línea Gantt.¿Por qué alguna vez scrollTop/scrollLeft no se puede escribir?
Inspección del código fuente componente, he encontrado la sincronización se implementa mediante el código siguiente:
this.oData.onscroll = function() {
self.panelTime.scrollLeft = this.scrollLeft;
self.panelNames.scrollTop = this.scrollTop;
};
marcado Todo HTML en el control de interfaz de usuario se generan dinámicamente por JavaScript. Todo está funcionando bien, excepto que lleva demasiado tiempo generar una lista de tareas de 800-ish.
Para mejorar el tiempo de renderizado, decido crear mi propio módulo de renderizado del lado del servidor para generar el marcado HTML idéntico con el lado del cliente originalmente generado. Este marcado se obtiene del lado del cliente usando jquery $ .get() ordinario y se inyecta a la página usando $ (el) .html(). Luego pongo el controlador de eventos necesario como la versión original del lado del cliente.
El problema ahora es que el desplazamiento paralelo no funciona. Pude capturar el evento de desplazamiento en el área del gráfico, pero no pude establecer la propiedad scrollTop del área de la lista de tareas. Pruebo en firebug para forzar manualmente la propiedad scrollTop, pero el valor no cambió. Parece que la propiedad scrollTop es de solo lectura.
¿Hay alguna explicación para esto?
Gracias por la explicación. Creo que he perdido el elemento por lo que la propiedad scrollTop va al div incorrecto. –