mappa geografica

[guidino]

Ciao a tutti,
ho trovato in rete una mappa delle regioni italiane che al passare del mouse mi visualizza accanto un'immagine con un testo, tutto in css.

di seguito un estratto del codice di stile.css

    #mappa a:hover span, #mappa {
    display:block;
    width:232px;
    height:273px;
    position:absolute;
    right:10px;
    top:10px;
    border:2px solid #CCCCCC;
    background-color:#FFFFFF;
    padding:10px;
    color:#333333;
    font-size:12px;
    line-height:18px;
    letter-spacing:1px;
    text-align:justify;
    overflow:hidden;
    z-index:20;
    } 

ed un estratto del codice html:

<div id="mappa">

<a href="#">
        
    [img]img/r1.gif[/img]
    <span>
                
        [img]img/r1.jpg[/img]
        [b]Regione 1[/b]
        [i]testo  testo testo...[/i]
    </span>
</a>
...
<a href="#">
    [img]img/r2.gif[/img]
    <span>
        [img]img/r2.jpg[/img]
        [b]Regione 2[/b]
        [i]testo  testo testo...[/i]
    </span>
</a>

</div> 

e funziona.
Ovviamente quando cambio regione mi viene visualizzato il contenuto dello span quindi mi campia immagine e testo.
Quello che vorrei fare e di cliccare su una regione per "fissarla" (cioè disabilitare l'evento onmouseOver?) in modo da passare con il mouse sul testo contenuto enllo span,
questo perchè all'interno dello span vorrei visualizzare dei link ad altre pagine.

Si può fare?

allego un'immagine che dovrebbe chiarire cosa sto facendo.

Grazie a chi potrà aiutarmi

[Mich_]

NO. il CSS da solo non lo sa fare.

Per la "risposta all'evento click" devi usare JS.
Sposto nel forum relativo

[guidino]

un aiutino?

anche se devo usare javascript va bene?

come faccio a tenere ferma l'immagine di destra quando clicco su una regione?

Grazie

[guidino]

UN piccolo aiuto?

[cavicchiandrea]

Mappa modificata http://webprogetti.it/mappaitalia/mappa.html

[guidino]

Grazie mille,
è proprio quello che cercavo.

[guidino]

Scusa cavicchiandrea,
dopo diversi tentativi chiedo ancora il tuo aiuto per inerire i link nella giusta posizione.

io ho fatto così ma non funziona, i link vanno per conto proprio mentre vorrei visualizzarli nel riquadro dell info della regione.

ho fatto così ma non va:

            <a href="#nogo" onclick="OpenRegione('reg9','campagna')">

                [img]img/campania.gif[/img]

                <span id="reg9">

                    [img]img/campania.jpg[/img]

                    [b]CAMPANIA[/b]

                    [i]Lorem Ipsum is simply dummy text of the printing and typesetting industry. 

                    Lorem  Ipsum has been the industry's standard dummy text ever since the 1500s, 

                    when an unknown printer took a galley of type and scrambled it to make a 

                    type specimen book.[/i]
                    <ul>[*][url="http://www.google.it"]Link 1...[/url][*][url="http://www.google.it"]Link 2...[/url]
[/list]
                </span>

            </a> 

Potresti darmi un altro aiuto?

Grazie