- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- Testo espandibile
-
Testo espandibile
<HTML>
<HEAD>
<TITLE>Testo espandibile</TITLE>
<STYLE TYPE="text/css">
body {background:white}
.fisso {color:blue; cursor:help}
.espandile {color:red; font-size:14pt}
.vuoto {display:none}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
function outliner() {
var child =
document.all[event.srcElement.getAttribute("child",
false)];
if (null != child)
child.className = child.className == "vuoto" ?
"espandile" : "vuoto";
}
</SCRIPT>
</HEAD>
<BODY ONCLICK="outliner();">
<H1 CLASS="fisso" child="menu">
Testo espandibile
</H1>
<DIV ID="menu" CLASS="vuoto">
Questo testo viene visualizzato quando il nome di
classe cambia da "vuoto" a "espandibile"
</DIV>
</BODY>
</HTML>se crei la pagina con questo codice avrai la parola testo che cliccandola si apre sotto il testo" questo....".
Il mio problema è avere questo effetto ripetuto più volte: esempiosulla pagina che vorrei c'è scritto "testo" clicco e si apre "questo......."
sotto una diversa parola che apre un diverso testo e sotto ancora due....Ci ho provato in tutti i modi... sospetto vada creato un .vuoto2 nel primo script e vada cambiato il secondo script:
ma come?Ciao!
-
Ciao ecco la risposta al tuo problema:
<html>
<head>
<title>Testo espandibile</title>
<style type="text/css">
body {background:white}
.fisso {color:blue; cursor:help}
.espandile {color:red; font-size:14pt}
.vuoto {display:none}
</style>
<script language="JavaScript">
function outliner() {
var child =
document.all[event.srcElement.getAttribute("child",
false)];
if (null != child)
child.className = child.className == "vuoto" ?
"espandile" : "vuoto";
}
</script>
</head>
<body onclick="outliner();">
<h1 class="fisso" child="menu1"> Testo espandibile </h1>
<div id="menu1" class="vuoto"> Questo testo viene visualizzato quando il nome di classe cambia da "vuoto" a "espandibile" </div>
<h1 class="fisso" child="menu2"> Testo espandibile </h1>
<div id="menu2" class="vuoto"> Questo testo viene visualizzato quando il nome di classe cambia da "vuoto" a "espandibile" </div>
<h1 class="fisso" child="menu3> Testo espandibile </h1>
<div id="menu3" class="vuoto"> Questo testo viene visualizzato quando il nome di classe cambia da "vuoto" a "espandibile" </div>
</body>
</html>Tutto chiaro vero?
Ciao
-
A una prima impressione mi sembra di poter rispondere assolutamente si alla tua domanda; poi andro' a mettere in pratica ( sul mio sito tra attività/gioco/index) e ora che l'ho detto se non ci riesco sono spu****ato
Ma adesso vorrei capire come si fa a IMPARARE il css script eccetera? io personalmente vado per tentativi; a volte infruttuosi.
Se tu mi rispondi subito; esiste un sistema per IMPARARE? Qual'èp.s. ancora Grazie
-
Ciao Sandro,
ti rimando ad un altro thread di questo forum:
[url=http://www.giorgiotave.it/forum/viewtopic.php?t=5857]Guide CSS