Una classe dentro l'altra

[ivanisevic82]

ANTEPRIMA PER CHI NON VUOLE LEGGERE TUTTO IL POST!!!

Qual'è l'errore in questo codice? Il fatto che c'è una classe dentro l'altra?

[img]image.jpg[/img]<span>Contenuto del TooTip</span></p>

FINE ANTEPRIMA

Ciao ragazzi, ho un problema.

Su una determinata immagine, al passaggio del mouse, devono avvenire due cose: cambio dell'immagine (tramite js) e deve spuntare un tooltip.

Ora, io per fare queste due cose, SEPARATAMENTE, non ho problemi: per il cambio di immagine uso questo codice (che è un pò particolare perchè è collegato all'effetto fade da creare):

[img]/media/thumb_photo1_ombra.jpg[/img]</p>

Per il tooltip quest'altro:

[img]/media/thumb_photo0_ombra.jpg[/img]<span>Contenuto del TooTip</span></p>

Ora, volendo combinare i due effetti ho provato semplicemente a infilare l'immagine con l'effetto fade dentro il tooltip:

[img]/media/thumb_photo1_ombra.jpg[/img]<span>Contenuto del TooTip</span></p>

Purtroppo non funziona: al caricamento l'immagine sparisce subito.

Ora, io sono quasi sicuro che dipenda dal fatto che si sono due classi una dentro l'altra:

....a class="css_tooltip" href="#nogo"><img class="fade"....

Sapete come si può risolvere il problema?

Vi lascio il link della pagina di prova che sto utilizzando: potete verificare a sinistra il corretto funzionamento delle immagini con effetto fade al passaggio del mouse e in basso una prova di tooltip funzinante, sempre al passggi del mouse sull'immagine.

http://www.ivanisevic82.com/pages/modding.php

Grazie per il supporto!

PS: ho verificato che se all'apertura mettere il mouse subito sull'immagine incriminata (la prima in alto a destra) non sparisce, ma non fà kmque quello che vorrei...

[ivanisevic82]

Up...

[Kreatore]

scusa ma invece di usare js per il tooltip.... usare title????

[ivanisevic82]

Originariamente inviato da Kreatore
scusa ma invece di usare js per il tooltip.... usare title????

Cioè? Cosa è title?
Puoi farmi un esempio scritto?

Grazie!

[ivanisevic82]

Ce l'ho fatta!

[img]/media/thumb_photo0_ombra.jpg[/img]</p>

Ho solo un problema col bordo...come potete vedere in questa pagina di prova (in alto a destra, passando col mouse sulla prima immagine): il bordo si comporta in maniera strana.
http://www.ivanisevic82.com/pages/prova-8.php
Sicuramente è perchè devo dire "no border" a entrambe le immagini...ma come faccio a scriverlo anche per la seconda?

Grazie!

[homezappa]

[img]/media/thumb_photo0_ombra.jpg[/img]</p>

HTH
Zappa

[ivanisevic82]

Grazie Zappa.
Ho apportato la modifica che mi hai consigliato, ma non và ancora bene.
Il motivo credo che sia semplice: le immagini che compongono l'effetto fade sono due: quando passo col mouse sopra, quella superiore diventa trasparente e si vede quella di sotto.
Il "no border" lo sto applicando a una sola delle due (infatti se guardate il link, non c'è un bordo ben fatto, ma solo in metà immagine!).

Come fare per applicarlo ad entrambe?

[homezappa]

Dal codice della tua pagina:

<a class="tooltip" href="#nogo" title="Prova Tooltip">
<span style="position: relative;">
[img]/media/thumb_photo0.jpg[/img]
[img]/media/thumb_photo0_ombra.jpg[/img]
</span>
</a>

(potrebbe) andare!
anzi, va!
(testato editando 'on the fly' il codice ricevuto tramite il plugin FireBug in Firefox!)


HTH
Zappa

[ivanisevic82]

Scusa io sono ignorantissimo...ma da dove viene quel codice?

Ti copio esattamente quello con cui produco l'immagine del mio link (la prima in alto)

[img]/media/thumb_photo0_ombra.jpg[/img]</p>

E' diverso da quello che hai postato tu!

In ogni caso, ho provato a inserire nella stessa pagina, de seguito alle altre immagini, il codice che hai postato, ma il risultato è quello che puoi vedere al solito link...

Cos'è che sbaglio o non capisco??

Grazie per il suppoto!

[homezappa]

Il codice che ho postato &egrave; quello che il mio browser riceve!
Penso che tu utilizzi un framework javascript per ottenere l'effetto fade, e che detto framework inietti l'img.

Quello che puoi fare &egrave; tagliare la testa al toro e dichiarare nell'head uno stile che si applichi alle immagini incriminate, tipo:

<style>
a span img {border: 0px none}
</style>

Se la sintassi, che ho buttato l&igrave;, &egrave; corretta, tutti i tag img che sono dentro un tag span che &egrave; dentro un tag a saranno senza bordo.

HTH
Zappa