Ciao,
non riesco a trovare una tecnica CSS in rete, e non ricordo come veniva definita.
Serve modificare il contenuto di altri elementi div al passaggio del mouse su un determinato div, e sostanzialmente sostituisce Javascript.
Potete consigliarmi o segnalarmi qualche risorsa?
Emanuele DG
<?php echo "Proverbio zen(d): vivi ogni giorno come se fosse il ".date('d M Y', time()); ?>
Intellectual property
Forse "rollover disgiunto "?
Maurizio
"se ami il lavoro che fai, non lavorerai mai un giorno in vita tua!"
Grazie mille Salasir
ho trovato questo esempio.
http://www.extrowebsite.com/articoli..._disgiunto.htm
Io intendevo un esempio simile a quello di sopra in cui però lo stato :hover di un elemento renda visibile più elementi, non un solo div come nell'esempio.
Oppure conosci il principio delle regole CSS che definiscono questo comportamento...
Emanuele DG
<?php echo "Proverbio zen(d): vivi ogni giorno come se fosse il ".date('d M Y', time()); ?>
Intellectual property
se controlli il codice dell'esempio da te postato ne capirai facilmente il funzionamento,
niente ti impedisce di aggiungere altri elementi allo stesso modo
Chissà se funziona pure con le immagini (al posto dei testi)......Interessante.....
Funge anche con le immagini, "ovvio"!
MA: controllate il comportamento su IE6
una volta apparse le immagini rimangono!
Funge correttamente su FF2.
per risolvere è sufficiente inserirle in un div...
Una cosa del genere l'avevo fatta con la tecnica del mapping; aveva un solo difetto: per qualche motivo, premendo il backspace, le immagini, che qui sono i brani sulla destra,non sparivano....rimanevano tutte....
Non ho mai capito perchè.......
Non è forse il bug di cui parla Vincent.Zeno?Originariamente inviato da simulacron
Una cosa del genere l'avevo fatta con la tecnica del mapping; aveva un solo difetto: per qualche motivo, premendo il backspace, le immagini, che qui sono i brani sulla destra,non sparivano....rimanevano tutte....
Non ho mai capito perchè.......
Il bug di MSIE 6 che non fa sparire le immagini al termine della condizione :hover e si risolve mettendole alll'interno di un div.
Emanuele DG
<?php echo "Proverbio zen(d): vivi ogni giorno come se fosse il ".date('d M Y', time()); ?>
Intellectual property
Ho analizzato il codice dell'esempio e sono risalito al principio di funzionamento:Originariamente inviato da Vincent.Zeno
se controlli il codice dell'esempio da te postato ne capirai facilmente il funzionamento,
niente ti impedisce di aggiungere altri elementi allo stesso modo
Ma mi chiedo: tutto qua?codice:<html> <head> <style type="text/css"> #rollover { font: 12px arial; cursor: pointer; } #rollover li a div { display: none; color: #f00; } #rollover li a:hover div { display: block; position: absolute; top: 50px; left: 20px; } </style> </head> <body> <div id="rollover"> <ul>[*] <a>Mostra il contenuto del primo div <div>Questo è il contenuto del primo div</div> </a> [*] <a>Mostra il contenuto del secondo div <div>Questo è il contenuto del secondo div</div> </a> [/list] </div> <div id="dest"></div> </body> </html>
Il solo posizionamento che si può dare ai layer da visualizzare è assoluto?
Niente di statico? (Lo preferisco perché pù facile da gestire nei layout fluidi).
Se volessi inserirlo all'interno del layer "dest" esiste qualche sistema per farlo con il contenuto generato, con gli pseudo elementi :before e :after?
Qualcosa che assomigli all'innerHTML di JavaScript, che ne so... Scrivo na cavolata solo per farmi capire, perdonate la selvaticità del codice:
#rollover li a:hover div {
#dest :before = #rollover li a div;
}
...cioè prendi quel contenuto e vallo a mettere lì dentro?
Emanuele DG
<?php echo "Proverbio zen(d): vivi ogni giorno come se fosse il ".date('d M Y', time()); ?>
Intellectual property
Forse posso risponderti anche io:
Il posizionamento assoluto lo si usa quando c'è qualcosa che deve essere estratto o è fuori dal flusso di istruzioni.
Il before e l'after non sono supportati da IE e da qualche altro browser......
Permessi di invio
Rispondi quotando
