molte immagini e ajax, o soluzione migliore?

Question

molte immagini e ajax, o soluzione migliore?

#1 da (1 voti)

0

Ho un controllo in cui l'utente può selezionare un valore per l'asse xey da 2 menu a discesa, quindi c'è una griglia 4 per 4 (un'immagine) che mostrerà a cosa corrispondono le loro selezioni (aggiornamento dinamico).

Quindi, se la griglia è:

a b c d
e f g h
i j k l
m n o p

Se l'utente sceglie 2 per riga (la colonna è null per ora), e f g h dovrebbe evidenziare (utilizzando una struttura). Se poi scelgono 3 per la colonna, dovrebbe evidenziare solo g . E così via per ogni combinazione.

So che posso capirlo facendo 25 immagini separate (una per ogni quadrato + 4 righe + 4 colonne + entrambe nulle) e poi carica l'immagine giusta usando ajax, ma la mia domanda è se c'è un modo migliore o una sorta di soluzione dinamica in cui posso disegnare sull'immagine, o sovrapporre un'altra immagine in modo intelligente?

user-interface efficiency

posta pennstatephil 26.02.2014 - 00:35

fonte

1 risposta

Leggi altre domande sui tag user-interface efficiency

Come misurare il successo di un piccolo progetto software? [chiuso] Che cosa è un modo ideale per passare regole / opzioni ai metodi che creano SQL

score 1 · Accepted Answer

Il modo in cui ho deciso di andare era usare un'immagine completa e css per trasformarla in sprite, inserire gli sprite in una tabella e usare i bordi della tabella e JavaScript per l'evidenziazione.

ETA: Il motivo per cui sono andato in questo modo (grazie a @gnat) era triplice:

Meno larghezza di banda - la riduzione di 1 immagine è molto più efficiente di quella che si ottiene tirando 25 (e dovendo usare ajax ogni volta che un'opzione cambia). Per non parlare del fatto che non devo creare e archiviare le suddette immagini.
Compatibilità con le versioni precedenti. Ogni browser può eseguire il rendering di una tabella con bordi, ma solo la nuova generazione di browser (conforme a HTML5) può utilizzare elementi come l'oggetto canvas, ad esempio, se dovessi disegnare sull'immagine.
Semplicità. È facile manipolare i bordi attorno a righe, colonne o una singola cella di una tabella utilizzando javascript.