script per tendina animata

**powerflash** · 30-09-2005, 22:53

Sto cercando un semplice script per fare delle tendine animate, cerco di spiegare.

dovrei avere un DIV di forma rettangolare in cui scrivere un titolo es.: "Ferramenta html.it" cliccando su questo titolo dovrebbe, animandosi, comparire un altro DIV subito sotto di esso, in cui scrivo altro testo "Indirizzo, tel, email ecc.".

dovrei metterne tanti uno di seguito all'altro, quindi se apro uno di questi gli altri di conseguenza devono spostarsi in basso.

**TheKing** · 01-10-2005, 19:47

Intanto devi creare i due div e mettre quello che vuoi far comparire sotto il primo poi devi scrivere questi codici:
Inserisci questo Script nella "<head>...</head>"

codice:

<script language="javascript" type="text/javascript">
function imposta_menu(){
  document.getElementById('div_secondario').style.display = 'none';
}
function abilita_div_secondario(){
  document.getElementById('div_secondario').style.display = 'block';
}
function disabilita_div_secondario(){
  document.getElementById('div_secondario').style.display = 'none';
}
</script>

Metti questo script nel tag body

codice:

<body onLoad="imposta_menu()">

Metti questaltro script nel tag div_primario:

codice:

<div id="div_primario" onmouseover="abilita_div_secondario()" onmouseout="disabilita_div_secondario()">

Prova Così sono sicuro che funzioni.

Fammi sapere

**powerflash** · 02-10-2005, 11:59

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="javascript" type="text/javascript">
function imposta_menu(){
  document.getElementById('div_secondario').style.display = 'none';
}
function abilita_div_secondario(){
	if (document.getElementById('div_secondario').style.display == 'none') {
		document.getElementById('div_secondario').style.display = 'block';
	} else {
		document.getElementById('div_secondario').style.display = 'none';
	}
}
function disabilita_div_secondario(){
  document.getElementById('div_secondario').style.display = 'none';
}
</script>
</head>

<body onLoad="imposta_menu()">
<table width="200" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
	<div id="div_primario" onclick="abilita_div_secondario()" style="position:relative; left:0px; top:0px; width:194px; height:69px; z-index:2; background-color: #FFFF00; layer-background-color: #FFFF00; border: 1px none #000000;"></div>
	<div id="div_secondario" style="position:relative; left:0px; top:0px; width:194px; height:69px; z-index:1; background-color: #993366; layer-background-color: #993366; border: 1px none #000000;"></div>
</td>
  </tr>
  <tr>
    <td>ssss</td>
  </tr>
</table>
</body>
</html>

Ok, funziona tutto, ho adattato per farlo solo al click, clicca una volta compare, clicca seconda volta scompare.

adesso rimane l'animazione, il tutto deve avvenire con un'animazione che scende per comparire e rilase per scomparire

**powerflash** · 04-10-2005, 11:53

up!

Discussione: script per tendina animata

Strumenti discussione

Ricerca discussione

Visualizza

script per tendina animata

Permessi di invio