codice dinamico con inner.HTML o cosa?

metalgemini

metalgemini

Utente Attivo
14 Apr 2004
745
0
0
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

PoLe

MRW Moderator
6 Giu 2005
2.198
3
0
40
.: Venezia :.
www.bzconsulting.it
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! :D
:byebye:
 
metalgemini

metalgemini

Utente Attivo
14 Apr 2004
745
0
0
Ciao Pole sono di nuovo io:D
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>
Clicca per allargare...

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:confused:
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:D
Puoi vederli qui:
Prova1

Prova2

:)
 
PoLe

PoLe

MRW Moderator
6 Giu 2005
2.198
3
0
40
.: Venezia :.
www.bzconsulting.it
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! :D

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

Buono studio!
:byebye:
 
metalgemini

metalgemini

Utente Attivo
14 Apr 2004
745
0
0
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! :D

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

Buono studio!
:byebye:
Clicca per allargare...
Grazie x la fiducia:D
Beh, io sono un autodidattissimo...di Javascript conosco pochi costrutti...potresti aiutarmi consigliandomi qualche parolina chiave di Javascript ke potrebbe essere usata inquesto caso:D
cmq mi metto all'opera poi ti faccio sapere;)
:byebye:
 
metalgemini

metalgemini

Utente Attivo
14 Apr 2004
745
0
0
Niente da fare...fa sempre come prima e cioè che quando scendo col puntatore i link apparsi si richiudono...
 
metalgemini

metalgemini

Utente Attivo
14 Apr 2004
745
0
0
Ho dato una sbirciatina al tutorial di Luca sulla creazione di un menù a tendina con Js & CSS.E' troppo fico:D
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>
Clicca per allargare...
:tifoso:
 
Devi accedere o registrarti per poter rispondere.
Discussioni simili
Autore Titolo Forum Risposte Data
metalgemini Spider e codice dinamico SEO e Posizionamento 2
M Analisi sito per pulire codice inutile HTML e CSS 1
JeiMax Modifica codice php personalizzato PHP 2
R Dubbi su siti sviluppati con Wordpress e con codice WordPress 6
L tipo boolean non funzionante su mariadb (mysql). E codice php 7.4. PHP 0
L Php_aggiornamento codice PHP 3
Shyson Codice wp-login non funziona PHP 2
G Codice html Javascript 1
Shyson Modificare codice e creare link PHP 0
F Il codice php è giusto? PHP 2
napuleone Con le date il codice da di matto o forse non è così Javascript 6
napuleone visualizzare il codice senza usare gli & HTML e CSS 1
Shyson Codice che trova item casuali PHP 1
E Barra di avanzamento codice PHP PHP 4
R [c#] Proteggere il codice dell'applicazione C/C++ 0
D modificare questo codice per inserimento in text e non in tabella jQuery 1
L salvare codice html in mysql PHP 3
A eliminare caratteri diacritici con codice ascii PHP 4
M Controllo del codice fiscale/partita iva PHP 11
Z Difficoltà codice data PHP 0
I PROBLEMA CODICE INSERTION SORT C C/C++ 2
I PROBLEMA CODICE C - INSERTION SORT Presentati al Forum 1
L login con solo un codice PHP 3
M Lanciare alert se il codice fiscale è già presente nel db e lasciare la scelta di inserire all'utente PHP 42
R Modifica codice per l'upload di più file PHP 1
gandalf1959 ricercare porzioni di codice da sito gestito con WordPress WordPress 11
D verifica codice fiscale persona fisica /aziendale stesso campo HTML e CSS 1
A Aprire la window form Add Connection da codice Visual Basic 4
felino [Wordpress] Sito web con codice malevolo WordPress 7
M [PHP] Istruzione "echo" all'interno di codice html PHP 2
C Refresh parte di codice pagina php PHP 6
Shyson [PHP] Aggiungere link al codice PHP 0
felino Domini hackerati con codice malevolo Hosting 2
A come spedire SMS da codice PHP con mdem USB PHP 0
M [PHP] Come inserire codice html in un ciclo while PHP 2
G Eseguire codice solo al termine della chiamata ajax Ajax 1
X [Apache] Creare sito clone/preservare codice sorgente Apache 7
felino [Dominio] File con permessi 444 e codice malevolo Domini 3
Shyson [PHP] Codice iscrizione e invio avviso nuovi articoli PHP 3
elpirata Implementare Copy to clipboard in codice html HTML e CSS 1
L [PHP] Problema su codice o server PHP 5
Shyson [PHP] Inserire testo nel codice PHP 2
Shyson [PHP] Nascondere codice PHP 3
H cancellare avatar in codice PHP PHP 2
G [PHP] Revisione codice per registrazione PHP 8
Shyson [WordPress] [PHP] Creare codice che evidenzia nuovi articoli WordPress 0
S [WordPress] Creare una select box con partita iva e codice fiscale in base a una logica. WordPress 0
M [PHP] Codice fiscale inverso PHP 3
P [HTML] Codice non funzionante su ZP HTML e CSS 1
A Conversione Codice da mysql a mysqli Database 1

Discussioni simili

Alto Basso