WebSite X5Help Center

 
Paolo M.
Paolo M.
User

Animazioni flash e image mapping su foto  it

Autor: Paolo M.
Besucht 1792, Followers 1, Geteilt 0  

Innanzitutto perdonate la mia scarsissima conoscenza, mi stò avvicinando in punta di piedi a questo software per tanto perdonate gli errori.

Stò tentando di realizzare un sito per un bar dove da una foto del bancone con sopra una scritta, da queste ultime (mappate ovviamente) dovrebbero scendere sul banco appunto, le foto dei vari cocktail che ulteriormente clikkati originerebbero una gallery con l'esecuzione e i suoi ingredienti.

Perdonate la banalità nella spiegazione del mio concetto.

Grazie a tutti

Gepostet am
20 ANTWORTEN - 3 NüTZLICH
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... come da titolo, in animazione Flash puoi fare di tutto, non hai limiti, magari da integrare con Swiffy come contenuto alternativo, ma devi essere molto esperto con Flash, e/o con SwishMax che usavo io, e per inserire l'animazione Flash in WebSiteX5 basta un click...

... in alternativa di fornisco solo una idea, e mi limito a ciò, facendoti vedere un esempio:  http://www.zspace.it/kolasim/website/divsino2K/index.html

... oppure, mappi l'immagine ed usi un IFRAME, ma devi avere le idee chiare; esempio primordiale: http://www.zspace.it/kolasim/website/iframe/link_iframe.html

... oppure potresti farti venire una idea da Snake.Xenzia, qui:  http://www.ilcacciatoredinuvole.it/accordion_3/index.html

... oppure, cercare in rete qualche risorsa che faccia al caso...

.

ciao

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Paolo M.
Paolo M.
User
Autor

Ottimo Kolasim,

ho costruito la mia immagine mappata con Macromedia fireworks MX 2004 e nella sua preview funziona alla grande, ora la devo esportare su Website ma ho trovato degli intoppi.

Dove devo incollare l'html che ho generato?

L'immagine originale la devo inserire nella creazione della pagina?

Dapprima ho incollato l'html nella sezione esperto ma in anteprima veniva riproposto il mio grigliato a tutta pagina e non localizzato solo nell'immagine creata.

Mi riscuso ancora per la mia scarsa conoscenza dell'argomento e del software stesso, portate pazienza.

Paolo

Mehr lesen
Gepostet am von Paolo M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... non conosco quel programma...

... prova ad esportare in rete la struttura che hai generato, html, swf, xml, cartelle ed altri files a servizio, e me li elenchi, e particolarmente, posta il link alla pagina HTML, in modo da vedere se ci posso capire qualcosa, ...e poi si vedrà...

.

ciao

... ciao Mirko, ...intanto che cercavo degli esempi, mi hai preceduto...

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Paolo M.
Paolo M.
User
Autor

Grazie Mirko innanzitutto,

si esattamente così, poi la foto rolloverata porterebbe ad una'altra pagina del sito ma faccio un passo alla volta.

Nel zip che posto abbiamo infatti un banco, dove in prossimità di alcuni oggetti dovrebbero apparire i tre cocktail sempre allegati;

che ne so uno in prossimità del pupazzo sulla sinistra ecc....

una specie di caccia al tesoro per scoprire quello che la location "costruisce".

Ovviamente mi studio il link,  ho una buona conoscenza del computer ma mi stò avvicinando alla categoria sites in punta di piedi, infatti html e css li conosco si può dire "di vista" e mi rendo conto sia una grossa lacuna,

grazie 1000

Paolo

Mehr lesen
Gepostet am von Paolo M.
Paolo M.
Paolo M.
User
Autor

Grazie per l'intervento anche a Kolasim intervenuto mentre stavo scrivendo a Mirko.

Allora il preview della mia immagine mappata e creata con firework mx2004 quando la visualizzo con paint per esempio non la vedo intera e già questo non me lo so spiegare, però in quest'altro zip vi mostro il testo html creato sullo screenshot sempre allegato.

Le tre immagini sono nel post precedente.

Paolo

Mehr lesen
Gepostet am von Paolo M.
Mirko Boschetti
Mirko Boschetti
Moderator

e qui una prova veloce con le tue immagini...

http://provews.altervista.org/bar/

ovviamente dovresti preparare l'immagine di sfondo di misure adatte e tutte le miniature pronte magari con la scritta gia sopra del nome del cocktail....

Mehr lesen
Gepostet am von Mirko Boschetti
Paolo M.
Paolo M.
User
Autor

MMMHHH!!!!!! Perdonami Mirko ma dove sono le immagini?

c'è solo lo sfondo del chiringuito, no?

Paolo

Mehr lesen
Gepostet am von Paolo M.
Mirko Boschetti
Mirko Boschetti
Moderator
Paolo M.
MMMHHH!!!!!! Perdonami Mirko ma dove sono le immagini? c'è solo lo sfondo del chiringuito, no? Paolo

quello che hai messo zippato tu è cosi....le immagini appaiono solo al passaggio del mouse...

Mehr lesen
Gepostet am von Mirko Boschetti
Esse Di
Esse Di
User
Mirko Boschetti
Paolo M. MMMHHH!!!!!! Perdonami Mirko ma dove sono le immagini? c'è solo lo sfondo del chiringuito, no? Paolo quello che hai messo zippato tu è cosi....le immagini appaiono solo al passaggio del mouse...

Passaggio del mouse dove?

Mehr lesen
Gepostet am von Esse Di
Mirko Boschetti
Mirko Boschetti
Moderator

effettivamente l'avevo provato solo con IE....

Mehr lesen
Gepostet am von Mirko Boschetti
Paolo M.
Paolo M.
User
Autor

Molto probabilmente sono applicazioni che non sono nelle mie corde, non ci stò capendo assolutamente niente e non voglio assolutamente fare perdere del tempo a nessuno, quello che vorrei realizzare lo avete capito tutti ma nessuno mi stà spiegando come fare praticamente:

l'ultima cattura di Mirko cosa rappresenterebbe?

vedo solo le mie immagini circoscritte da "x".

Il link di EsseDi spiega altrettanto bene ma come realizzo la mappatura, con i comandi CSS3 da editare in base alla mappa oppure con un software di terze parti dove creare le zone editabili?

Sono veramente alle primissime armi,

riririscusatemi,

Paolo

Mehr lesen
Gepostet am von Paolo M.
Esse Di
Esse Di
User
Paolo M.
.............................. Il link di EsseDi spiega altrettanto bene ma come realizzo la mappatura, con i comandi CSS3 da editare in base alla mappa oppure con un software di terze parti dove creare le zone editabili? ..............................

Non sono certo di avere capito quello che vuoi dire.

Le immagini occorrenti le hai già.

Devi solo determinare dimensioni e posizione dell'angolo in alto a sinistra delle porzioni da mappare. E ciò può essere fatto con qualsiasi programma di grafica.

Fra l'altro, in quest'altra pagina è anche spiegato come fare con Gimp

http://www.essedi.altervista.org/_sito/mappatura-immagine.html

Mehr lesen
Gepostet am von Esse Di
Paolo M.
Paolo M.
User
Autor

Grazie ragazzi,

quindi una volta determinate le coordinate x e y degli oggetti da inserire nelle mappe devo editarle nella formula CSS per esempio oppure in tag area giusto?

Domani full immersion.

Paolo

Mehr lesen
Gepostet am von Paolo M.
Paolo M.
Paolo M.
User
Autor

Ed eccomi qua,

Con Gimp ho effettuato la mappatura dell'immagine ed esportato il testo della mappa ma quando la trascrivo nell'editor di Website non esce niente o perlomeno la mappatura sembrerebbe fuoricampo, ho seguito alla lettera anche il demo di essedi ma non riesco a farla funzionare.

Se non vi arreca troppo disturbo con i dati zippati in allegato sareste così gentili da crearmi il codice così da studiarmi cosa continuo a sbagliare?

E' tutto chiarissimo in teoria ma in pratica purtroppo.............

Santi subito!!!!!!!!!

Paolo

Mehr lesen
Gepostet am von Paolo M.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Paolo M.
Grazie ragazzi, quindi una volta determinate le coordinate x e y degli oggetti da inserire nelle mappe devo editarle nella formula CSS per esempio oppure in tag area giusto? Domani full immersion. Paolo

... giusto...

... comunque devi anche impadronirti del programma che hai usato o qualsiasi altro, anche direttamente in rete, e fare degli esperimenti per capire, pubblicando in rete per osservarne e far osservare i risultati ottenuti...

... in questo Argomento troveresti altri metodi utili, semplici, nelle cui pagine si deve decifrare il codice in chiaro:  http://answers.websitex5.com/post/93150

... tanto per stare in tema col Titolo, ed avendo il vecchio catorcio a portata di mano, ho voluto farti un veloce esempio minimale con SwishMax (c'è lo SWI):  http://www.zspace.it/kolasim/prove/mappatura/cocktail1.html

... qui è tradotto in HTML5(!) :   http://www.zspace.it/kolasim/prove/mappatura/cocktailSwiffy.html

... e questo, il tradizionale in JS, fatto con PSP cliccando, ma il codice che puoi vedere nella pagina è universale, quindi potrebbe non occorrereree nessun programma:    http://www.zspace.it/kolasim/prove/mappatura/cocktail_js.html



...

Mehr lesen
Gepostet am von  ‪ KolAsim ‪ ‪
Paolo M.
Paolo M.
User
Autor

BELLISSIMO!!!!!!!!!

Perdonate l'urlo di approvazione, è esattamente quello che mi piacerebbe fare,

Grazie 1000 Kolasim e grazie a tutti gli intervenuti  credo di avere di tutto di più, ora tocca solo a me.

Paolo

Mehr lesen
Gepostet am von Paolo M.
Esse Di
Esse Di
User
Paolo M.
Ed eccomi qua, Con Gimp ho effettuato la mappatura dell'immagine ed esportato il testo della mappa ma quando la trascrivo nell'editor di Website non esce niente o perlomeno la mappatura sembrerebbe fuoricampo, ho seguito alla lettera anche il demo di essedi ma non riesco a farla funzionare. Se non vi arreca troppo disturbo con i dati zippati in allegato sareste così gentili da crearmi il codice così da studiarmi cosa continuo a sbagliare? E' tutto chiarissimo in teoria ma in pratica purtroppo............. Santi subito!!!!!!!!! Paolo

Però stiamo giocando a non capirci.

Il riferimento a GIMP nell'ultimo mio messaggio era solo per suggerirti uno strumento per rilevare coordinate e dimensioni delle porzioni da mappare, ma non era una indicazione all'utilizzo della mappa generata da Gimp. Il metodo del tag area non ti permette di mostrare le immagini ingrandite dei vari cocktail.

Una volta in possesso delle immagini occorrenti, delle posizioni e delle dimensioni delle aree da mappare, devi applicare il metodo dellla mappature con CSS

http://www.essedi.altervista.org/_sito/con-css.html

come ti è stato indicato da Mirko e da me.

Il sistema suddetto prevede una unica immagine suddivisa in varie componenti: normanale, immagine da mostrare al passaggio del mouse su porzioni non mappate, immagini da mostrare al passaggio del mouse su porzioni mappate. Posizione e dimensioni delle suddette componenti possono essere determinate sempre con Gimp.

Mehr lesen
Gepostet am von Esse Di