codice dinamico con inner.HTML o cosa?

metalgemini · 14 Apr 2006

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 Apr 2006

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!

:byebye:

metalgemini · 20 Apr 2006

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

Grazie 10.000.000

metalgemini · 20 Apr 2006

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 Apr 2006

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!
:byebye:

metalgemini · 21 Apr 2006

PoLe ha scritto:
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!
:byebye:

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

:byebye:

daviduccio · 21 Apr 2006

Prova così

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

metalgemini · 21 Apr 2006

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

metalgemini · 21 Apr 2006

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:

<script type="text/javascript">
function ApriMenu(i)
{
document.getElementById("SMENU"+i).style.visibility = "Visible";
}
function ChiudiMenu(i)
{
document.getElementById("SMENU"+i).style.visibility = "Hidden";
}
</script>

<style type="text/css">
div.SMENU
{
visibility:hidden;
width:100px;
}
div.allineasx
{
float:left;
}

</style>

<div onmouseover="ApriMenu(1)" onmouseout="ChiudiMenu(1)" class="allineasx">
<a href="#">Link1</a>
<div id="SMENU1" class="SMENU">
<a href="#">Link1.1</a><br>
<a href="#">Link1.2</a><br>
<a href="#">Link1.3</a>
</div>
</div>

<div onmouseover="ApriMenu(2)" onmouseout="ChiudiMenu(2)" class="allineasx">
<a href="#">Link2</a>
<div id="SMENU2" class="SMENU">
<a href="#">Link2.1</a><br>
<a href="#">Link2.2</a><br>
<a href="#">Link2.3</a>
</div>
</div>

:tifoso:

Cerca

Cerca

codice dinamico con inner.HTML o cosa?

metalgemini

Utente Attivo

PoLe

MRW Moderator

metalgemini

Utente Attivo

metalgemini

Utente Attivo

PoLe

MRW Moderator

metalgemini

Utente Attivo

daviduccio

Moderatore

metalgemini

Utente Attivo

metalgemini

Utente Attivo

Discussioni simili