codice dinamico con inner.HTML o cosa?

**metalgemini** · 14-04-2006, 18:11

Ciao a tutti, non avendo nulla da fare vorrei tanto imparare a creare codice html dinamico in javascrip.
Tipo Clicca qui e una volta cliccato si apre un testo o altro nel punto della pagina ke ho stabilito...io so ke bisogna fare una cosa di questo genere:

<script>
document.getElementById('ciao').innerHTML = 'Ciao!';
</script>
<div id="ciao"></div>

Ma mi sa ke sono fuori strada...chi mi illumina?O cercato in rete ma c'è tutta roba incasinata...grazie

**PoLe** · 20-04-2006, 09:28

Eccoti un primissimo spunto, fai così metal

<html>
<head>
<script>
function cambiatesto(tx){
if (tx=='testo1') {
document.getElementById('prova').innerHTML='questo è il testo numero UNO!'
}
if (tx=='testo2') {
document.getElementById('prova').innerHTML='mentre questo è il secondo testo!'
}
}
</script>
</head>
<body>
<a href="javascript:cambiatesto('testo1')">testo uno</a><br>
<a href="javascript:cambiatesto('testo2')">testo due</a>
<br><br>
<div id='prova'>qui appare il testo</div>
</body>
</html>

Buono studio!

**metalgemini** · 20-04-2006, 11:07

Ciao Pole grazie infinite è proprio quello che cercavo di fare!

Grazie 10.000.00

**metalgemini** · 20-04-2006, 15:30

Ciao Pole sono di nuovo io

Sto cercando di applicare quello che ho imparato grazie a te per cercare di creare un menù a tendina ma ovviamente faccio del casino. La mia piccola idea è di creare un tot di link orizzontali e che ognuno all' onMouseOver facciano apparire sotto di essi altri link...insomma l'idea è banale ma non mi riesce!Per ora sto facendo con un link solo...
posto il codice nella speranza che tu o qualche altro santo mi aiuti nell'impresa:

creo la classe dei link orizzontali e della prima sottosezione(i links ke appariranno sotto il primo link)
<style type="text/css">
div.menustatic
{
position:absolute;
left:0;
top:0;
}
div.sot1
{
position:absolute;
left:0;
top:19;
}
</style>
Lo script Javascript
<script type="text/javascript">
//con questa funzione gli dico di creare i link
function apri1()
{
document.getElementById('sotsez1').innerHTML = '<a href="pagina.htm">Sotto sezione 1.1</a><br><a href="pagina2.htm">Sotto sezione 1.2</a><br><a href="pagina2.htm">Sotto sezione 1.3</a>'
}
function chiudi1()
//con questa funzione gli dico di levare i link
{
document.getElementById('sotsez1').innerHTML=''
}
</script>
<div class="menustatic">
<a href="#" onMouseOver="apri1()">Link1</a>
</div>

<div id="sotsez1" class="sot1" onMouseOut="chiudi1()"></div>

In pratica quando metto il puntatore sul link appaiono gli altri link sotto...ma quando scendo con il mouse e supero il primo dei link apparsi si chiudono tutti

Poi ho notato che se nel innerHTML = 'ecc ecc' levo le ancore <a> invece non lo fa...ma non ho piu l'ancoraggio alle pagine

Puoi vederli qui:
Prova1

Prova2

**PoLe** · 21-04-2006, 09:04

Da quel che ti "conosco" so che sei ingrado perfettamente di riuscirci da solo metal!

Prova a pensarci ancora qualche giorno, e ricorda di non fissarti mai su di un unica via... la soluzione verrà da se!

Più avanti casomai ti aiuterò volentieri, ma prima devi darci sotto un pò!

Buono studio!

**metalgemini** · 21-04-2006, 11:51

Originariamente Scritto da PoLe

Da quel che ti "conosco" so che sei ingrado perfettamente di riuscirci da solo metal!

Prova a pensarci ancora qualche giorno, e ricorda di non fissarti mai su di un unica via... la soluzione verrà da se!

Più avanti casomai ti aiuterò volentieri, ma prima devi darci sotto un pò!

Buono studio!

Grazie x la fiducia

Beh, io sono un autodidattissimo...di Javascript conosco pochi costrutti...potresti aiutarmi consigliandomi qualche parolina chiave di Javascript ke potrebbe essere usata inquesto caso

cmq mi metto all'opera poi ti faccio sapere

**daviduccio** · 21-04-2006, 13:41

Prova così

.....innerHTML = '<a href=\'pagina.htm\'>...........

**metalgemini** · 21-04-2006, 14:40

Niente da fare...fa sempre come prima e cioè che quando scendo col puntatore i link apparsi si richiudono...

**metalgemini** · 21-04-2006, 18:11

Ho dato una sbirciatina al tutorial di Luca sulla creazione di un menù a tendina con Js & CSS.E' troppo fico

Adesso stavo cercando di renderlo orizzontale dando al livello che ha l'onmouseover e l'onmouseout il float:left;...solo ke il livello nascosto, mi si visualizza se ci metto sopra il mouse...cosa che dovrebbe fare solo mettendo il puntatore sul primo link:

Discussione: codice dinamico con inner.HTML o cosa?

Strumenti Discussione

Visualizzazione

codice dinamico con inner.HTML o cosa?

Permessi di Scrittura