Schiarire un immagine 
Autore: Andrea Scaglia
Visite 1750,
Followers 1,
Condiviso 0
Ciao a tutta la Community,
Navigando tra i template presenti sul sito mi sono imbattuto in questo:
http://answers.websitex5.com/post/75627
Sono rimasto colpito dall'effetto bianco che avviene, durante il passaggio del mouse, sul cane, la pittura, il modulo di contatto ecc.
Mi piacerebbe imparare a crearlo. Qualcuno mi può gentilmente aiutare?
Grazie mille a tutti
Postato il
... prova con gli esempi di Snake.Xenzia: http://www.ilcacciatoredinuvole.it/rollover/roll_over_con_css.html
.
ciao
Autore
Come faccio questo passaggio in Incomedia?
Dove inserisco questo codice?
Grazie mille
......ma non è una semplice funzione dell'oggetto immagine in evo 10 la "semitrasparenza"?...........spulcia le opzioni avanzate di sicuro la trovi......
Autore
Quando metto il bottone immagine nei quadranti mi da le seguenti personalizzazioni:
1) Generale: Dove carico l'immagine e mi da la possibilità d'inserire parole chiave
2) Visualizzazione: Qui ci sono gli effetti. In realta l'effetto che vorrei si chiama Opacità, ma il problema è che me lo fa solo nel colore nero. Non esiste la tonalità bianca.
3) Sitemap: = a punto 1
Non trovo semitrasparenza da nessuna parte.
Il codice sopra lo posso anche inserire se mi dite come farlo funzionare :)
Vi ringrazio molto
Autore
P.S. Ho Website X5 Professional
... io non ho programmi, ...ma secondo me basta seguire le indicazioni date dallo stesso Snake.Xenzia ...anche se per la v.8, non penso che cambi molto conoscendo il programma...
... quello che è oggetto HTML ovviamente sarà l'oggetto HTML&WIDGETS | sezione HTML
... quello che è scheda CSS ovviamente sarà l'oggetto HTML&WIDGETS | sezione Esperto | riquadro Codice CSS
... prova; ...si tratta di un copia/incolla, e fai vedere il LINK in rete dell'esempio che avrai fatto...
... per come è adesso il codice, come puoi notare da te, le immagini devono risiedere nella root del sito, per cui le devi inviare con programma FTP terzo, oppure in allegato all'oggetto HTML&Widgets | ESPERTO | Allegati, senza dichiarare la cartella destinataria, ...!... o se la dichiarerai, allora devi modificare il codice con l'indicazione di questa cartella; ...in questo caso, per esempio, quella che è la dichiarazione con uno.jpg ...diventerebbe files/uno.jpg
.
Dalla demo di evo 10 io clicco:
Oggetto immagine
Nel Tab Generale
Inserisco l'immagine
Nel Tab Visualizzazione a destra trovo Visualizzazione su passaggio del mouse
Apro il menu a tendina e seleziono Opacità Crescente
Credo ci sia anche in professional..........altrimenti che cavolo di versione è..............se ha robe in meno della evo..........
... per la Professional, è detto qui:
Passo 3 - Creazione della Pagina > Oggetto Immagine
>>> http://goo.gl/nz4KTc
.
Autore
C'è questo tasto ed è quello che premo dall'inizio quando ho iniziato a smanettare per creare questo effetto.
Solo che quando vado in Anteprima per vedere l'effetto, al posto di andare verso una tonalità bianca, mi va verso una tonalità scura (nero)... in altre parole, al posto di illuminarsi, tende a sparire (diventando più scura).
Come faccio a farla illuminare verso il bianco?
Grazie mille
Autore
Ho applicato i seguenti passaggi:
1) Ho inserito l'oggetto HTML&WIDGETS all'angolino in basso della mia pagina web. Nella parte Html ho inserito:
<a class="linkgdr" href="</span><span class="ff2 fc3 fs10 fb ">#"><img class="imImage"src="</span><span class="ff2 fc3 fs10 fb ">uno.jpg"alt="</span><span class="ff2 fc3 fs10 fb ">testo alternativo"/></a>
e nella CSS ("Sezione Esperto" ho inserito i valori.
Appena apro l'anteprima vedo solo un quadratino che non fa altro. L''immagine non è visibile. In che cartella devo mettere le eventuali immagini inviandole via FTP? Fatto questo riesco a vedere nell'anteprima l'effetto o quali altri passaggi mi mancano?
Grazie Mille
perchè l'immagine diventa "trasparente" e quindi passa il colore che hai sullo sfondo, se imposti il bianco come sfondo della cella e regoli i margini per evitare cornici non volute, ottieni lo stesso effetto del sito indicato
... non avendo il programma, e né programmi, con conosco le classi in gioco, come usate da Snake.Xenzia.; quindi ti consiglio di seguire queste mie semplici idicazioni:
1) ... allega le tue immagini tramite il pannello ESPERTO | ALLEGATI dell'Oggetto HTML&WIDGETS, lasciando "files" come cartella destinataria, proposta per default;
2) ... nel pannello HTML dell'Oggetto HTML&WIDGETS, incolla questo codice TIPO per una immagine delle immagini allegate, esempio immagine1.jpg :
<a class="alfa" href="#"><img style="border:0px" src="files/immagine1.jpg"/></a>
come puoi notare il percorso relativo è "files/immagine1.jpg" che modificherai per le altre immagini;
3) ... nell'Oggetto HTML&WIDGETS| sezione Esperto | riquadro Codice CSS ...incolla questo codice:
a.alfa img {filter:alpha(opacity=100);
-moz-opacity:1.0;opacity:1.0;margin:0px;}
a.alfa:hover img {filter:alpha(opacity=50);
-moz-opacity:0.50;opacity:0.50;margin:0px;}
4)... avvia l'anteprima e verifica, e fammi sapere del risultato, ...altrimenti passiamo dopo all'alternativa in HEAD...
... in poche parole, ricapitolando, è subito fatto in due secondi...
- allega le immagini che andranno in cartella files automaticamente;
- copia ed incolla il codice 2) nel pannello HTML correggendo la stringa per ogni immagine allegata;
- copia ed incolla il codice 3) nel pannello Codice CSS e vale per tutte quelle immagini;
...
... nota:
- l'attributo del TAG A, href="#", ...al posto del cancelletto # puoi inserire l'indirizzo di una pagina, href="NomePagina.html" oppure con l'URL assoluto del tipo href="http:eccetera";
... se hai difficoltà, fammi sapere; ..anche se non ho programmi, vedremo di venirne a galla...
... intanto guarga nel codice sorgente di questa mia pagina di esempio, chiarissima: http://www.zspace.it/kolasim/website/immagini/rolloverALFA.html
.
ciao