Colorare zone di immagini 
Autor: Massimo F.Salve e Buona Sera a Tutti.
Uso Website X5 v.13, avrei la necessità di creare una pagina con all'interno un immagine di una cucina, su tale immagine devono esserci dei punti sensibili al click, in seguito ad esso l'utente dove avere la necessità di scegliere il colore per riempire la zona di immagine scelta, (le zone corrispondono alle varie parti della cucinta, tipo: Top, cassetti, piani, ecc.).
Un esempio potrebbere essere questo:http://www.cucinelube.it/it/cucine-moderne/essenza/ Dove gli utenti cliccando sui pallini rossi possono scegliere i vari colori da usare per riempire le zone corrispondenti ai vari pallini.
Spero di essermi spiegato e di avere notizie in merito dai guru di website x5.
Nel frattempo Grazie Infinite a tutti quelli che mi risponderanno. Buona Serata e Buon Lavoro.
... non è ben chiaro quel che vuoi fare ed ottenere...
... in quel link non vedo pallini rossi...!...
... se ti riferisci alle mappature, puoi mappare semplicemente con OO.o, oppure anche direttamente online: http://www.maschek.hu/imagemap/imgmap
... con SwishMax sarebbe stato semplicissimo ed altamente configurabile, ma ormai superato...
...adesso potresti usare > WebAnimator, compagno ideale di WebSiteX5, che non conosco personalmente, ma so che ha possibilità molto simili, semplificandoti la mappatura, ed altro...
.
Autor
Ciao Kolasim, innanzitutto grazie per la risposta. Hai ragione sul link. Cmq per rendere l'idea: seguendo il link ti mostra una cucina e sotto delle icone a forma di cerchi, cliccando sulla secona da destra "Mix&Match" ti fa scorrere la pagina fino a... "configura la tua Essenza". Cliccando su quel tasto ti apre una foto mappata dove si vedono i pallini rossi, cliccando sui vari pallini ti apre un pannello dove scegliere un colore, dopo aver scelto la variente che ti interessa lui ti ricolora la zona abbinata al pallino cliccato di quel colore.
In sintesi volevo sapere se con websitex5 questa cosa era possibile realizzarla o altrimente quale strumento abbinare a wsx5.
Grazie Mille
... penso proprio che WebAnimator sia l'ideale; ...puoi provare la demo...
... per farti capire la potenza di SwishMax ti faccio vedere > questo vecchio esempio minimale; ...l'immagine è unica, ed anche la maschera, che prende colore al click con delle variabili; ... lo stesso potresti ottenerlo con WebAnimator, penso!!!...
... idea!! ...se vuoi ottenere un risultato simile, e senza sapere niente di niente, ed addirittura con un risultato molto più leggero di quel tuo link postato prima, dovresti salvare tutte le immagini necessarie per le varie combinazioni, ed al click sul bollino rosso far aprire nello stesso IFRAME la combinazione scelta; ...solo il lavoro di grafica per le varie immagini...
... una delle maschere usate nel tuo link di esempio;
448 KB:
.
... altra alternativa, più complicata per non esperti, sarebbe quella di far uso delle maschere in vari DIV_CUSTOM visibili/non visibili
.
ciao
.
quin un miniesempio su spunto di lemonsong & stesil che credo sia quello che chiedi...
http://www.skeggia12.it/test/dyn/immagini.html
click sulle lettere sotto la foto...
Autor
Ciao Kolasim grazie ancora.
sicuramente una prova con web animator la farò. Infatti ho già scaricato la trial. Volevo chiederti nel caso wa non mi permette di farlo posso provare con html5 o Javascript ?. È un lavoro da fare client side o server side utilizzando altri linguaggi...?
ps: Incomedia cosa risponde è una cosa che wa può permettere di fare...?
grazie ancora.
@Massimo, per info su WebAnimator , apri un post sul loro forum...
http://forum.webanimator.com/
Autor
Grazie
il mio suggerimento è passato inosservato... forse è troppo facile da fare...
Autor
Ciao Skeggia scusami non ci avevo fatto caso... però non ho capito come hai fatto a realizzarlo, puoi essere più preciso è interessante.
Grazzie e scusa ancora.
no tranquillo massimo... mica mi sono offeso... ci mancherebbe... ho riscritto il post proprio perchè mi sembrava quello che cerchi...
è un vecchio esempio ricavato con un codice js scritto da lemonsong&stesil... credo abbastanza semplice da realizzare...il css per personalizzare il tutto, sempre scritto da loro è facilissimo da personalizzare...
praticamente c'è una immagine di sfondo di base, e i tre pulsanti sotto fanno vedo/nascondo ad altre tre immagini png che si sovrappongono alla base... devi solo prepararti le immagini e poi sovrapporle... come i puntini rossi del link che hai postato tu... se vuoi ti posto il codice...
Autor
Si Grazie Skeggia
... per il mio metodo con IFRAME, immediato, non si deve usare nessun linguaggio extra, e basta lavorare solo di grafica... (*)
... per il mio secondo metodo (mostra/nascondi), per altro simile all'esempio di Skeggia, si realizzerebbe in JS, ti impegnerebbe di più, sia lato programmazione che graficamente, con un peso complessivo maggiorato di circa 1/6°; ...ma sei appassionato ed hai tempo puoi provarci, comunque mai semplice come con SwishMax...
.
(*) - per esempio, supponendo di avere due combinazioni intrecciate del tipo, tutto rosso, tutto blu, mezzo rosso/mezzo blu, mezzo blu/mezzo rosso ...dovresti realizzare quattro semplici immagini, ognuna con la propria combinazione; ...ovviamente per ogni combinazione in più occorreranno le relative immagini, ma è un lavoro che non richiede impegno particolare se non solo un po' di pazienza...
.
ciao
devo per il momento sospendere la pubblicazione del codice in quanto l'esempio postato era inserito nella v11pro... prima di postarlo ho provato a inserirlo nella v13.1pro e non funziona regolarmente... waiting...
Autor
Ciao Kolasim;
il problema e che le combinazioni possono essere tantissime, sia per le zone che si possono personalizzare, sia per le varianti di colore o texture che possono essere utilizzate. La via migliore quindi sarebbe quella di sviluppare una funzione ad hoc, con codice o qualche software appropriato. Ma non mi sono mai occupato di queste cose quindi non so da dove cominciare ne che linguaggio e necessario usare, ne tanto meno se il codice deve essere serverside o clientside.
Cmq spero nei vostri consigli per portare al termine la missione.
Granzie ancora.
ciao, ... con le mie idee basta il browser, quindi HTML ed al massimo JS; ...non serve PHP, a meno che non ti serva per il trattamento e salvataggio dei dati sul server...
... e possibilmente sarebbe meglio far da se...
... comunque sia ed in ogni caso, non sarà un'avventura semplice; ... le combinazioni, sia se in grafica che in codice devi pur farle, e quelle in grafica devono sempre essere fatte; ...purtroppo non è più possibile, ma con SwishMax sarebbe stato un vero giochetto ottenere risultati superiori a quelli del tuo esempio senza scervellarsi più di tanto...
... prova WebAnimator; ... dovrai lavorarci, ma otterrai da te quello che vuoi...
... alla base di tutto ci vuole la conoscenza degli strumenti che si dovranno usare, almeno per quel tanto di base che necessiti...
... nessuno nasce imparato ...
bye
.
...