far apparire immagine sotto testo con rollover

  • Creatore Discussione Creatore Discussione pati
  • Data di inizio Data di inizio

pati

Utente Attivo
31 Gen 2007
64
0
6
Ciao a tutti, qualcuno può darmi un consiglio su come posso far apparire un'immagine sotto una parola con rollover? Con un semplice codice riesco a farlo accanto alla parola, ma ho una serie di parole una accanto all'altra e le immagini relative ad ognuna devono aprirsi al di sotto. Grazie a tutti!
 
Ciao, non è necessario javascript, puoi tranquillamente sfruttare i css
HTML:
<style>
    ul {
        margin:0;
        padding:0;
        list-style-type: none;
    }
    ul li {
        float:left;
        margin:0 5px;
        border:1px solid blue;
        width:128px;
    }
    ul li p {
        text-align: center;
        padding:2px;
        margin:0;
    }
    ul li img {
        display: none;
    }
    ul li:hover img {
        display: block;
    }
</style>
<ul>
    <li>
        <p>sole</p>
        <img src="http://www.i2clipart.com/cliparts/0/d/5/f/clipart-sun-sole-0d5f.png" alt="sole"/>
    </li>
    <li>
        <p>luna</p>
        <img src="http://www.caltabellottameteo.com/Resources/Luna.png" alt="luna"/>
    </li>
    <li>
        <p>stella</p>
        <img src="http://img2.wikia.nocookie.net/__cb20130604154057/nonciclopedia/images/8/80/Stella_stilizzata.jpg" alt="sole"/>
    </li>
</ul>
 
Ciao, scusa il ritardo della mia risposta. Purtroppo nel frattempo le cose sono cambiate, non per mia scelta. Grazie comunque, la tua indicazione potrà sicuramente servire ancora!
 

Discussioni simili