eccomi!!

Di: mitac | 26/09/2020 18:04:07
Ciao, sicuramente le immagini rollover non c'entrano niente!! comunque vi spiego cosa vorrei fare:
In modalità Layout ho creato una tabella grande poi delle celle dove all'interno ci sono delle piccole miniature di foto..100x100px per intenderci.
Io vorrei che al passaggio del mouse sopra queste miniature, venisse visualizzato in un'altra cella sottostante o area, il nome della foto o comunque un testo qualsiasi e così via via per le altre miniature, ma senza che io ci clicco sopra!
Poi chiaramente quando clicco sulla miniatura faccio aprire una _blank con la foto ingrandita.
So che è una cavolata farlo ma devo rispolverare la memoria...chi mi può aiutare?.

Risposte


Come creare un Rollover con Dreamweaver MX

Ecco lo script che Dreamweaver inserisce nel tag HEAD per realizzare un Rollover:
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
Poi bisogna ricordarsi di fare il preload dell'immagine di Rollover, altrimenti la prima volta che l'utente passerà sopra il rollover non vedrà niente perché l'immagine ha iniziato a caricarsi da quando ci è passato sopra con il mouse.
Esempio:
<body onLoad="MM_preloadImages('img02.gif')">
-- img01.gif è l'immagine di rollover che verrà caricata appena la pagina html sarà aperta.
Infine il link sarà così:
<a href="javascript:;" onMouseOver="MM_swapImage('Image1','','img02.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="img01.gif" name="Image1" width="100" height="100" border="0" id="Image1"></a>
-- chiaramente nell'href puoi inserire il collegamento utile per le tue esigenze.
Tutto questo serve per creare un rollover.
Ma adesso andiamo a vedere come farlo ancora più semplicemente con Dreamweaver:
- crea le due immagini di Rollover (più leggere sono e meglio è per tutti)
- apri Dreamweaver e inserisci la prima immagine nella cella della tua bellissima tabella
- seleziona l'immagine con il pulsante sinistro del mouse
- scegli la voce Comportamenti dal menu sulla destra "Progettazione"
- clicca sul simbolo + per aggiungere un comportamento
- scegli scambia immagine dall'elenco di comportamenti
- nella finestra di dialogo scegli "sfoglia" e vai a trovare la tua immagine n.2 per il Rollover
- Ok, puoi chiudere la finestra
- Godi del risultato.
- Inserisci il link andando su Proprietà > Collegamento
Fammi sapere, però mi raccomando, scrivi solo se hai problemi, non per farti spiegare tutto quello che non sai.
Grazie, ciao.

Di: Pablito | 26/09/2020 18:05:07

eccomi!!

Come sempre sei preciso nelle informazioni, ti ringrazio e cercherò di postare solamente se ho problemi grossi!
Ma quello che volevo ottenere io non è un rollover, almeno penso.
Io volevo che al passaggio del mouse sopra la miniatura e quindi senza clikkare, venisse fuori su un'altra cella a parte, oppure un campo a parte o in un'altra tabella il nome della foto oppure un testo qualsiasi.
Quello che mi fai presente tu è che al passaggio del mouse c'è uno scambio di immagine sempre nella stessa cella.
Forse non ho capito io o mi sono spiegato male.
Chiaramente quando però vado a clikkare sopra la miniatura, mi apre una finestra _blank con l'immagine ingrandita...per quello mi arrangio.
Caspita ma come fai a sapere tutto su DW, ma riuscirò anche io a sapere tante cose su questo favoloso programma.
ciao e buona giornata.

Di: mitac | 26/09/2020 18:05:07


Ah, ecco... grazie, ora ho capito.
Vedrò di trovare una soluzione in Dreamweaver, però già ti posso dire che con Fireworks questa cosa che devi fare tu mi sembra più semplice. Riguardo alla conoscenza, quella arriva con lo studio, la ricerca e la sperimentazione.
E poi il motto del sito è condividere la conoscenza, ed è quello che sto facendo. Il discorso però vale per tutti.
Ripassa fra un paio di giorni che oggi io avrò una giornataccia, ciao.

Di: Pablito | 26/09/2020 18:05:07

prova con i livelli

O selezioni l'immagine e poi nella finestra proprietà ci metti un testo alternativo, col nome dell'immagine, o utilizzi i livelli e i comportamenti. In questo secondo caso devi creare un livello dove ci scrivi o ci metti quello ke vuoi, lo selezioni e nelle proprietà nascondi la visibilità. Poi selezioni l'immagine vai nel pannello comportamenti del gruppo progettazione e aggiungi (+) mostra/nascondi livelli. Seleziona il livello, quindi "mostra", quindi ok.
Ora cambia l'evento in "on mouse over". Ripeti l'operazione e questa volta seleziona "nascondi" quindi ok, quindi cambia l'evento in "on mouse out".
Il livello lo puoi spostare dove vuoi e ci puoi inserire sfondo, testo o immagini e puoi lasciare il rollover sull'immagine.
ciao

Di: carletto | 26/09/2020 18:06:07


Si è vero, giocando sulla visibilità dei livelli, in Dreamweaver puoi far apparire e scomparire degli elementi al semplice passaggio del mouse. Grazie a Carletto per questa soluzione e per aver condiviso la sua conoscenza.

Di: Pablito | 26/09/2020 18:06:07

eccomi!

Grazie ragazzi per le soluzioni, opterò per i livelli vista la facilità con cui si realizza.
Ciao

Di: mitac | 26/09/2020 18:06:07


Sto realizzando anch'io la stessa identica cosa, cioè il comportamento di scambia immagine e funziona perfettamente: all'evento onMouseOver su una thumbnail mi appare da un'altra parte il suo dettaglio ingrandito, però mi succede questo di strano. Ovvero, nella mia gallery ho immagini sia in verticale che in orizzontale e quando devo visualizzare una in orizzontale si stringe. Se cambio, cioè metto come prima foto una orizzontale, si allarga quella verticale. Che cosa sbaglio? Nella cella del dettaglio ingrandito c'è sufficiente spazio per visualizzare correttamente la foto in orizzontale. Per esempio questa pagina: http://www.robineschner.com/paintings/leaves-paintings/leaves-paintings.html fa esattamente quello che voglio. Cosa c'è che non capisco???? Grazie Massimo

Di: Massimo Avini | 26/09/2020 18:06:07