È davvero una grande funzionalità dell'interfaccia utente che posso modificare le mie liste al clic senza pulsanti specifici. Sembra un grande editor wysiwyg con link e tag evidenziati. Quale tecnica js usano? Contenteditable per lo spionaggio e quindi textarea per la modifica?In che modo workflowy ha implementato la modifica in linea?
9
A
risposta
27
Sono uno dei due ragazzi che costruisce WorkFlowy. Quando sposti il mouse sulla pagina, abbiamo un'area di testo opacity:0
che viene posizionata sul testo per l'oggetto che stai passando sopra in qualsiasi momento. Ha esattamente lo stesso contenuto e la stessa formattazione del contenuto sottostante.
Quando si fa clic, l'area di testo viene messa a fuoco e viene creata opacity:1
e il contenuto viene imitato da opacity:0
. Quindi quando digiti, sincronizziamo il contenuto tra la textarea e il contenuto di destinazione. Probabilmente ci sposteremo in un'area di testo completamente invisibile in futuro, poiché ciò consentirà la modifica di testo avanzato. Questo è ciò che fanno molti IDE basati su HTML.
Workflowy sembra richiedere un account utente per vederlo in azione. –