hover sobre texto?

[lincenegro]

Buenas de nuevo!

Quisiera aprovechar este hilo para preguntar...

1.Como puedo hacer lo mismo pero en vez de que al poner el raton encima de la imagen salga un texto?

2.Para que salga ese texto tengo que hacer otra pagina html solo con el div o de que forma deberia hacerlo?

Pongo tal y como lo tengo ahora aunque sin mucho resultado, no se muestra ninguna imagen al poner o sacar el raton:

Código HTML:

<!-- start content -->
    <div id="content">
        <div class="post">
            <a href="#" onmouseover="document.getElementById('girona').src='images/img02.gif';"  onmouseout="document.getElementById('girona').src='../menu%20pobles/images/barcelona.gif';"></a>
        </div>
    </div>
    <!-- end content -->
  <div id="inici-index">
        <div id="inici"><a href="http://www.forosdelweb.com/f4/index.html"><h3>INICI</h3></a></div><div id="inici2"><a href="index.html"><h3>INDEX</h3></a></div>
    </div>
    <!-- start sidebar -->
    <!--[START-QM0]--><ul id="qm0" class="qmmc">
    <h1>GIRONA</h1>
    <img src="http://www.forosdelweb.com/f4/menu%20pobles/images/girona.gif" alt="" id="girona" />
    <h1>BARCELONA</h1>
    <img src="http://www.forosdelweb.com/f4/menu%20pobles/images/barcelona.gif" alt="" id="barcelona" />
    <h1>TARRAGONA</h1>
    <img src="http://www.forosdelweb.com/f4/menu%20pobles/images/tarragona.gif" alt="" id="tarragona"  />
    <h1>LLEIDA</h1>
    <img src="http://www.forosdelweb.com/f4/menu%20pobles/images/lleida.gif" alt="" id="lleida" />
  <!-- end sidebar -->
 

Agradeciendo de antemano la ayuda.