showDiv / hideDiv con link-immagine

mile

Nuovo Utente
26 Lug 2007
2
0
0
vicino a Udine
Ciao a tutti!

Sono nuova di questo forum. Premetto che ne so poco di javascript.

Devo creare una pagina con div sovrapposti che appaiano e scompaiano cliccando sui relativi link-immagine. Ovviamente il tutto funziona con Firefox ma non con IE ed Opera.

Se utilizzo link di testo il tutto funziona perfettamente. Ma a me servono i link immagine!:(

E' un po' che ci sto sopra ma non trovo la soluzione!:( :(

Qualcuno mi può aiutare per favore??!

Di seguito vi scrivo il codice.

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script type="text/javascript">
function showDiv(divid){
document.getElementById(divid).style.display = 'block';
}
function hideDiv(divid){
document.getElementById(divid).style.display = 'none';
}
</script>


</head>
<body>
<table title="Menu di navigazione progetti">
<tr>
<td>
<a href="javascript:;" onclick="showDiv('andromeda');hideDiv('auditoriumPD');hideDiv('gambato');hideDiv('gwangiu');" >andromeda</a>
</td>
<td>
<a href="javascript:;" onclick="hideDiv('andromeda');showDiv('auditoriumPD');hideDiv('gambato');hideDiv('gwangiu');" >padova</a>
</td>
<tr />
<tr>
<td>
<a href="javascript:;" onclick="hideDiv('andromeda');hideDiv('auditoriumPD');showDiv('gambato');hideDiv('gwangiu');" ><img name="gambato" src="../img/photo_gallery/gambato_icoOFF.jpg" border="0" /></a>
</td>
<td>
<a href="javascript:;" onclick="hideDiv('andromeda');hideDiv('auditoriumPD');hideDiv('gambato');showDiv('gwangiu');"><img name="gwangiu" src="../img/photo_gallery/gwangiu_icoOFF.jpg" border="0" /></a>
</td>
<tr />
</table>


<div id="andromeda" style="display: block">
<img src="../img/photo_gallery/andromeda.gif" alt="Immagini progetto Andromeda" />
</div>
<div id="auditoriumPD" style="display: none">
<img src="../img/photo_gallery/auditorium_padova.gif" alt="Immagini Auditorium di Padova" />
</div>
<div id="gambato" style="display: none">
<img src="../img/photo_gallery/gambato.gif" alt="Immagini progetto Gambato" />
</div>
<div id="gwangiu" style="display: none">
<img src="../img/photo_gallery/gwangiu.jpg" alt="Immagini giunto" />
</div>

</body>
</html>
 

PoLe

MRW Moderator
6 Giu 2005
2.198
3
0
40
.: Venezia :.
www.bzconsulting.it
Prova a modicare così ;)

Codice:
function showDiv(divid){
document.getElementById(divid).style.[COLOR="Blue"][B]visibility[/B][/COLOR]='[B][COLOR="blue"]visible[/COLOR][/B]';
}
function hideDiv(divid){
document.getElementById(divid).style.[COLOR="Blue"][B]visibility[/B][/COLOR]='[B][COLOR="blue"]hidden[/COLOR][/B]';
}

:byebye:
 

mile

Nuovo Utente
26 Lug 2007
2
0
0
vicino a Udine
Grazie PoLe per l'aiuto.

Ho provato ad utilizzare il tuo metodo...funziona ma mi posiziona i div uno sotto l'altro, non uno sovrapposto all'altro come riesco a visualizzare in firefox.

Comunque ho trovato il problema: ho chiamato con lo stesso nome gli ID dei div e il NAME dei link immagine :(!

Ora però è sorto un altro problema...ovviamente solo in IE!

Le gif animate non partono più! penso sia colpa del
"document.getElementById(divid).style.display = 'block';" che stoppa l'animazione della gif.

Ma se lo sostituisco con
"document.getElementById(divid).style.visibility = 'visible' non ho la sovrapposizione dei div!

:crying::crying:

Mi puoi consigliare qualcosa?

:byebye:
 
Discussioni simili
Autore Titolo Forum Risposte Data
F access ricerca record con apostrofo. MS Access 0
F Cerco Hosting con VECCHIE versioni di php Hosting 0
C Come ricreare questo calcolatore di prezzi a step con woocommerce? WordPress 0
C Segnalo barra laterale di navigazione ASSENTE con Chrome Comunicazioni dallo Staff 5
G Guadagna dalla Vendita di Articoli Sponsorizzati con GuestPostMax.com! Guadagnare col Sito 0
P Hosting multidominio con Plesk Hosting 0
L Soluzione con INNER JOIN Database 0
S passare un valore da un form a un file .php con metodo post PHP 4
A Redirect 301 genera url statico con variabili Web Server 0
T problemi con dati menu a tendina HTML e CSS 2
T Query con date MS Access 1
F Url dinamiche da cambiare con categoria, subcategoria e title PHP 2
L Aiuto con DataGridView Visual Basic 1
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
G Problema con Xampp Web Server 1
M Aggiunta prodotti nel carrello con lo stesso in e varianti diverse PHP 0
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
B Non riesco a trovare i cognomi con i caratteri speciali in Access (Microsoft 365) MS Access 0
N Problema con position absolute e overflow HTML e CSS 4
M Estrarre soltanto i prodotti con stessa descrizione PHP 10
felino [Wordpress] Gallery con foto selezionabili dall'utente WordPress 0
G Invio di più valori con la stessa checkbox PHP 4
csi Inviare file jpg in locale alla stampante con php PHP 0
otto9due Proteggere una cartella e file con password tramite .htaccess e .htpasswd Web Server 0
I Form con selettore HTML e CSS 0
G phpmailer e php 8.1 con estensione mysqli PHP 6
L Problema con inner join PHP 11
K [php] Problema con inner join PHP 4
N Vendo sito web di casino online con 1000 giochi Compravendita siti e domini 0
G form invio multiplo con checkbox PHP 12
L Query e selezione DB con $_POST PHP 2
K [PHP] Problema con variabili concatenate. PHP 1
R Dubbi su siti sviluppati con Wordpress e con codice WordPress 6
B Router e telecamere con pannello solare IP Cam e Videosorveglianza 0
Z Cerco ecommerce gratuito meglio se realizzato con Woocommerce di Wordpress. E-Commerce 0
S [CERCO] scambio di articoli con link Offerte e Richieste di scambio links 0
A Immagine decentrata con sfondo trasparente Photoshop 0
O problema con query PHP 4
Jensen Errore di sintassi con DELETE PHP 3
D Casella di testo con grassetto ecc... HTML e CSS 2
R Aprire maschera con Openform filtrando un campo testuale con un valore recuperato da un'altra maschera MS Access 10
G Query con i giorni della settimana MySQL 10
I problema con 2 account Posta Elettronica 1
L problema collegamento file css con html HTML e CSS 1
G Il mio sito dopo aver abilitato l'ssl non visualizza le immagini con indirizzi senza ssl HTML e CSS 0
A Connessione a mdb con php7 PHP 1
P errore 404 con javascript Javascript 2
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0

Discussioni simili